RSousa6 Posted May 12, 2018 Share Posted May 12, 2018 Hello, i'm starting with prestashop, and however i already scanned the documentation link and made some searchs, i couldn't find the answer for this doubt of mine. So, if anyone could help me i would be really glad. In this first days of contact with prestashop, i have found some elements configuration with the "Classe" parameter like on the picture below. This "classes" make changes on the display of the elements, am i right? However, i'm trying to find all the list available to use on this parameter, but i couldn't find it. I mean, on this example i have "new-product", but there are others and, if there aren't present on the examples, i wouldn't be able to notice they exist. So ... where can i find this "shortcodes" available for each element? Is it on tpl files (i read about them but couldn't be sure)? There is some file where i can find all of them or of the theme in use? If someone could give me an explanation i would really appreciate it. Best Regards Link to comment Share on other sites More sharing options...
razaro Posted May 12, 2018 Share Posted May 12, 2018 Hi and welcome to forum and PrestaShop. First you did not mention what version you have and do you use custom module or theme there. From screenshot it looks like custom theme and module for menus. And to me that "Classe" is connected to CSS class that would be assign to menu item so it could be styled differently maybe. That could be maybe explained in theme/module documentation. Link to comment Share on other sites More sharing options...
RSousa6 Posted May 13, 2018 Author Share Posted May 13, 2018 razaro thanks for the welcome and for the help. i'm using latest version of prestashot and a custom theme (sp_market17). I followed your advice and took a look at the manual of the theme on the css part. I get the locations of part of the css files styles and i think i'm getting it. It look there's no list available of custom classes available, but at least now i think i get it where they come from. Anything more and i will talk about it. Thank you! Link to comment Share on other sites More sharing options...
razaro Posted May 13, 2018 Share Posted May 13, 2018 After checking demo of theme I see they have added classes for pages they placed in menu. So they have "new-products", "special", "blog", "contactus" and "aboutus". And they they use it in demo in layout 3 to have orange color if page from menu is active. #index.content-v1 .sp-megamenu .home>a,.content-v1 .sp-megamenu .home:hover>a{color:#fff;background:#7d7d7d}#module-smartblog-category.content-v1 .sp-megamenu .navbar-nav>li.blog>a{color:#fff;background:#7d7d7d}.content-v1 .sp-megamenu .navbar-nav>li.active a{background:#7d7d7d}.sp-megamenu .navbar-nav>li.active a{background:#f4a137}#contact.content-v1 .sp-megamenu .navbar-nav>li.contactus>a{background:#7d7d7d}#new-products.content-v1 .sp-megamenu .navbar-nav>li.new-product>a{background:#7d7d7d;color:#fff}#prices-drop.content-v1 .sp-megamenu .navbar-nav>li.specials>a{background:#7d7d7d;color:#fff}#cms.content-v1 .sp-megamenu .navbar-nav>li.aboutus>a{background:#7d7d7d}#index .sp-megamenu .home>a,.sp-megamenu .home:hover>a{background:#f4a137;color:#fff}#new-products .sp-megamenu .navbar-nav>li.new-product>a{background:#f4a137;color:#fff}#prices-drop.sp-megamenu .navbar-nav>li.specials>a{background:#f4a137;color:#fff}#contact .sp-megamenu .navbar-nav>li.contactus>a{color:#fff;background-color:#f4a137}#cms .sp-megamenu .navbar-nav>li.aboutus>a{color:#fff;background-color:#f4a137}#module-smartblog-category .sp-megamenu .navbar-nav>li.blog>a{color:#fff;background:#f4a137}#new-products .sp-megamenu .navbar-nav>li.newarrival>a{color:#fff;background-color:#f4a137}#prices-drop .sp-megamenu .navbar-nav>li.specials>a{color:#fff;background-color:#f4a137}#module-smartblog-category .header_v3 .sp-megamenu .navbar-nav>li.blog>a:after{background-color:#f4a137}#contact .header_v3 .sp-megamenu .navbar-nav>li.contactus>a:after{background-color:#f4a137}#new-products .header_v3 .sp-megamenu .navbar-nav>li.newarrival>a:after{background-color:#f4a137}#prices-drop .header_v3 .sp-megamenu .navbar-nav>li.specials>a:after{background-color:#f4a137}.sp-megamenu .home>.dropdown-menu li a:hover{color:#f4a137} So you will not find a list, it is just custom class name so you may want to style it directly. For example, some kids store and each menu item is in different color Link to comment Share on other sites More sharing options...
RSousa6 Posted May 14, 2018 Author Share Posted May 14, 2018 Correct razaro. I was just a little lost because i didn't know (or was in doubt) that my doubt was related to css styles or other elements or specific configuration related to prestashop. After you told me it was about css, i was able to figure out. Once again, thank you Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now