Jump to content
Snade

[FREE THEME] Nice&Clean Customizable Default Theme Skin (updated 06.08)

Recommended Posts

Thank you.. I really like this work..

 

I have just implemented it for my store but something goes wrong with the 'viewed product' block on the left side... it stopped displaying the product image..

 

http://www.gingerdeals.com/

 

In order to test this, please browse through couple of products first and then come back to home page,. you will images are not displaying under 'VIEWED PRODUCT' section..

 

Please can you help, thanks in advance.

Share this post


Link to post
Share on other sites

Thank you.. I really like this work..

 

I have just implemented it for my store but something goes wrong with the 'viewed product' block on the left side... it stopped displaying the product image..

 

http://www.gingerdeals.com/

 

In order to test this, please browse through couple of products first and then come back to home page,. you will images are not displaying under 'VIEWED PRODUCT' section..

 

Please can you help, thanks in advance.

Share this post


Link to post
Share on other sites

Home menu is centered to the right and goes off the page? any ideas?

 

 

SOLUTION:

Snade, jacksfregio:

 

I think that this is a known issue when updating the shop to 1.5.4.1

 

EDIT. I knew I had read it somewhere:

www.prestashop.com/forums/topic/242732-1541-default-theme-menu-moved-to-right-how-to-fix/

 

 

Hello,

 

Does anyone have any idea how to make the product name display entirely in grid view ?

 

I have tried to change the truncate: value from everywhere but nothing happens.

 

http://img191.images...neproblema1.jpg

 

Can anyone help me please ?

 

Thank you.

You must increase the height of the element, also the whole featured products box.

 

 

Good Afternoon Snade,

I need help: I installed your theme at first found it very show.

But look what happened following link and print.

http://lojavirtualconceptweb.uni5.net/

 

I await your help.

hug

Very slow ? Its only 20kb, and if you Turn On CCC you wont even have the extra http request...

The missplaced menu is known 1.5.4.1 issue, look for fix above.

 

 

 

Thank you.. I really like this work..

 

I have just implemented it for my store but something goes wrong with the 'viewed product' block on the left side... it stopped displaying the product image..

 

http://www.gingerdeals.com/

 

In order to test this, please browse through couple of products first and then come back to home page,. you will images are not displaying under 'VIEWED PRODUCT' section..

 

Please can you help, thanks in advance.

 

1. I dont see Viewed product module.

2. This is CSS-ONLY skin, so if there is a problem with the functionality of your shop, you should probably look somewhere else. The theme changes only the styling and has little efect over your shop functionality.

Share this post


Link to post
Share on other sites

My header menu stays like this:

 

35f678318629b790a9f8afb4f938722b.png

 

Edit: Fixed. In the cleantheme.css search for :

 

 

#search_block_top{left:0px;position:absolute;top:21px;}

 

and replace with:

 

 

#search_block_top{center:0px;position:absolute;top:21px;}

Edited by R0b3rt017 (see edit history)

Share this post


Link to post
Share on other sites

Hello Snade,

I picked in today on your post, as newbie, have I strungled forwards in exploring PS v 1.5.4.1.

I have read many topics, but I like your style.

I use the Standard theme, changes nothing in the original files.

 

When I want to start with your great work, some newbie questions:

Do I have installing PS first overnew, ore can I pick up in the installed Standard theme?

 

What about the auto upgrade from PS? (1 click upgrade), I have reading something that they don't upgrading anything that have chanced in files.

 

Thanks for sharing your great work!

Best Regards,

Generaal

 

Share this post


Link to post
Share on other sites

@Generaal

 

I'm not quite sure what exactly youre asking me, but will try to answer.

 

This skin is made for the default theme and you should use it. In order to look as on the demo you need the default modules configuration, but if you havent moved any modules dont worry about this.

 

If you upgrade from 1.5.4.0 to 4.1 adn you uprage the defaulth theme also, you'll have to integrate the skin again by adding the 1 line of code in header.tpl

 

Hope that helps

Share this post


Link to post
Share on other sites

Excellent theme.. But can anyone explain how to install it..

Youtube is banned in my country.

I'm using version 1.5.

Share this post


Link to post
Share on other sites

Excellent theme.. But can anyone explain how to install it..

Youtube is banned in my country.

I'm using version 1.5.

Dont want to be rude, but cant you spend 2 min and read for yourself ?

  • Like 1

Share this post


Link to post
Share on other sites

Dont want to be rude, but cant you spend 2 min and read for yourself ?

 

Sorry, if that sounded lazy to you..

 

But I have been trying to install the theme from last hour, but I think there's some problem in my installation of prestashop..

Sorry, I'm a newbie here, just got excited..

I'll keep things in mind from now onward :)

Share this post


Link to post
Share on other sites

Sorry, if that sounded lazy to you..

 

But I have been trying to install the theme from last hour, but I think there's some problem in my installation of prestashop..

Sorry, I'm a newbie here, just got excited..

I'll keep things in mind from now onward :)

make a clean install if you messed up your current one, copy the css file in the defaulth theme css folder and add the one line of code to your header.tpl

thats it. Read the instructions provided in the archive, there is also example tpl file, (dont use it just copy the code from there)

  • Like 1

Share this post


Link to post
Share on other sites

Thanks for the anwser, Snade.

I will give it soon a tray to install your nice theme and come back to inform you.

 

Best Regards,

Generaal

Share this post


Link to post
Share on other sites

really nice theme , only one question : How do i change the cleantheme.less file ?

Share this post


Link to post
Share on other sites

Hello, sorry but I don't found this code into cleantheme.css

 

 

@color1: #444; //menu, some tables headers, and where dark color is needed

@color2: #F15A23; // The main color of the theme

@color3: #EEEEEE; // light color used mainly for some borders

 

Where can I configure that please ?

Edited by Denys06 (see edit history)

Share this post


Link to post
Share on other sites

hi ur template is excelent :)

i love it,is it possible to make it rtl?

i wanna make it suitable 4 my language

tnx

Share this post


Link to post
Share on other sites

Hello, sorry but I don't found this code into cleantheme.css

 

 

 

 

Where can I configure that please ?

 

OK i have understand, I need to change color into the .less file

Share this post


Link to post
Share on other sites

Buddy, according to what I see in the demo. I think there's a problem, in the left column appears:

 

- Ipods

- Accesories

- Laptops

 

But in the top bar just appears Ipods and Accesories, why does it happen? I haven't downloaded the theme but, I have the same problem with another one, how can it be fixed? please, help me, would be reaaaaally nice for my shop having all the categories, or at least most of them in the top bar, makes it look much better.

 

Thank you for reading.

Share this post


Link to post
Share on other sites

I just installed LESS-Clean Theme, 23/04 on Prestashop version 1.5.4.1. Used the header.tpl, and cleantheme.css files provided into a fresh default theme folder, and the horizontal menu is skewed to the right.

Any Ideas?

 

Thanks in advance!

 

EDIT

Found the link that you posted for the solution @ www.prestashop.com/forums/topic/242732-1541-default-theme-menu-moved-to-right-how-to-fix/

 

Thanks for the cool theme!

 

LESS-CleanTheme.PNG

Edited by planewrench (see edit history)

Share this post


Link to post
Share on other sites

SOLUTION:

 

 

 

 

You must increase the height of the element, also the whole featured products box.

 

 

 

Can you guide me to change the height of element and the featured product box so that the product name appears in full? Thanks!

Share this post


Link to post
Share on other sites

I'm experimenting with this theme, which I'm pretty pleased with, but there is one problem that's driving me nuts!

 

I have a left column and a centre column only, and on the left column I have a Specials block and a Viewed Products block. In the Viewed Products block, my product names all begin with 'Hand-Knitted', but the names are truncated and an ellipsis (...) is added, so they all appear with the same name: 'HAND-KNITTE...' - which is not particularly helpful.

 

I have searched everywhere to try & find out how to get the product name to just word wrap, but without success. The Viewed Products block is not mentioned spcifically in the cleantheme.css. I've tried adding it in to make it work like the Specials block (which word wraps the product name no problem) - but no go. I can get the description below the viewed product name to word wrap, but not the name itself (see screenshot).

 

 

 

I thought I had found the answer in the blockviewed.tpl file, which appears to have a hard-coded ellipsis & truncation based on 14 characters. However, tweaking this makes no difference.

 

BTW the query #131 above from Sparknet (originaly post #100 by srm200) is similar, but refers to the truncation of product names on the Featured Products block. I was able to overcome this issue by adjusting the text-overflow, word-wrap and white-space values (to clip, normal and normal resp.). I just wish I could find where to apply similar adjustments for the product name in the Viewed Products block. Adjusting the height of the element didn't solve it.

 

Anyone got any ideas?

 

Thanks, Dave

Share this post


Link to post
Share on other sites

Hello,

 

thank you for very nice for this theme, it is realy nice and clean !

May I have one question, I want to add some text into top search window.

Let say "Enter your text here". I found some previous advices, the modules/blocksearch/blocksearch-top.tpl

should be edit. Original code is:

 

<input class="search_query" type="text" id="search_query_top" name="search_query" value="{if isset($smarty.get.search_query)}{$smarty.get.search_query|htmlentities:$ENT_QUOTES:'utf-8'|stripslashes}{/if}" />

 

Where exactly should I modify it?

 

Thank you very much for your advice!

 

Miro

www.poladoskovo.eu

Share this post


Link to post
Share on other sites

how can i hook Top seller,new product block in right column at shoping cart ,order confirmation and my account page. i hook modules but nothing display. only blank right column.

Share this post


Link to post
Share on other sites

Fisrt Page.

 

Link is not there? Will be great if you post here.

 

Thanks

Share this post


Link to post
Share on other sites

hi I'm wondering how you can add a background image and how to change text colors.

Share this post


Link to post
Share on other sites

Link is not there? Will be great if you post here.

 

Thanks

I just looked, and the link is still there, about 3/4 of the way down his post. Look for:

DOWNLOAD - Updated 23/04,

Keep in mind that he updates the link in his post on page one with his latest version and this one may or may not be the most current.

:D

Edited by planewrench (see edit history)

Share this post


Link to post
Share on other sites

Thanks for a great theme...

I have a clean install of 1.5.4.1 and use your theme with the danish language pack.

 

BUT, when I click on a product Category or on a product, it ueses the american language. If i click home everything is back to Dansih.

What might be the problem here, I have cache turned off.

 

Jesper

Share this post


Link to post
Share on other sites

Hi,

 

Some body have italian instruction to install this theme??

 

I have a problem i don't know in what folder i most put cleantheme.less.

 

who can help me??????

 

Angel

Edited by computertime (see edit history)

Share this post


Link to post
Share on other sites

First of all, i want to thank you for this perfect work. I've followed the instructions and i haven't any problem. I'm new in less files, so i want to ask, what are the advantages to use this method instead of the traditional css-edit way??

 

Thank s

Share this post


Link to post
Share on other sites

Hello everybody, how can i add a backgroun image?

 

Many thnaks! :)

hi I'm wondering how you can add a background image and how to change text colors.

Read the instructions and just put your background after the bgcolor: variable in the less file, as you would normally do in css.

 

 

 

Thanks for a great theme...

I have a clean install of 1.5.4.1 and use your theme with the danish language pack.

 

BUT, when I click on a product Category or on a product, it ueses the american language. If i click home everything is back to Dansih.

What might be the problem here, I have cache turned off.

 

Jesper

Not sure tbh, but for sure its not related to the theme as this is only a CSS SKIN. it does not change the prestashop functionality or html elements in any way.

 

 

How do I add the New Product Block above the Feature Products Block ?

not theme related, just go to Modules -> Positions

 

First of all, i want to thank you for this perfect work. I've followed the instructions and i haven't any problem. I'm new in less files, so i want to ask, what are the advantages to use this method instead of the traditional css-edit way??

 

Thank s

You can check out http://lesscss.org/ for more information about whats new in LESS. Almost the same is the other popular preprocessor SASS.

Generally this is the future of CSS. Its still the good old CSS, but with the posibility to add basic logic, variables mixins and etc, which makes the code much faster to write, easier to read, A LOT easier to maintain and most importantly for me, easily customizeable.

As you can see, only by inserting one HEX value, you get a cross-browser CSS3 button with gradient background, border and hover state. Changing the same thing in CSS is pure pain in the ass.

 

 

Look at this beautiful piece of LESS

 

This

 #gradient > .vertical(#f2612d, #f36c3b);

equals this

background-image: -moz-linear-gradient(top, #f2612d, #f36c3b);
   background-image: -ms-linear-gradient(top, #f2612d, #f36c3b);
   background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f2612d), to(#f36c3b));
   background-image: -webkit-linear-gradient(top, #f2612d, #f36c3b);
   background-image: -o-linear-gradient(top, #f2612d, #f36c3b);
   background-image: linear-gradient(top, #f2612d, #f36c3b);
   background-repeat: repeat-x;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2612d', endColorstr='#f36c3b', GradientType=0);

 

with the help of this

 

#gradient {
 .vertical(@startColor: #555, @endColor: #333) {
   background-color: mix(@startColor, @endColor, 60%);
   background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
   background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10
   background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
   background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
   background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
   background-image: linear-gradient(top, @startColor, @endColor); // The standard
   background-repeat: repeat-x;
   filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down
 }
 }

Edited by Snade (see edit history)

Share this post


Link to post
Share on other sites

 

wow, thank you, i understand now, very useful. You convinced me.

Share this post


Link to post
Share on other sites

How i can increase the size of the header? I've tried putting the height attribute in header and header_right but with no luck. I can solve it with negative margins and dirty things like that but i wanted to do it in a more elegant way. Thank you in advance!

 

header.png

Edited by robvalca (see edit history)

Share this post


Link to post
Share on other sites

Add dimensions to the logo image element and it will fit in nicely :)

Share this post


Link to post
Share on other sites

Add dimensions to the logo image element and it will fit in nicely :)

 

Sorry, could you be more specific? I don't want to make the logo smaller, i want it exactly that it shows in the screenshot....

 

thanks again...

Share this post


Link to post
Share on other sites
:) give me url and I'll give you the css

Share this post


Link to post
Share on other sites

As from the frist look on the theme, I liked it but is it for free ?

and how is it with SEO?

I want to learn more about the Prestashop and what is it ?

 

Thanks,

 

George D

Edited by how to make money (see edit history)

Share this post


Link to post
Share on other sites

"Search" button in header does not appear properly in IE9. The add to cart buttons do not either.

Edited by crichw (see edit history)

Share this post


Link to post
Share on other sites

Hello Snade

 

This is one of the best work i have seen here. You rock man !! \m/

 

I'm looking forward for further updates in future and especially support for the IE. Its urgently required. The add to cart buttons in IE seems like a bug. Please have a look and if possible include support IE in the skin.

 

But still it is an awesome skin. :)

Edited by Cadfin (see edit history)

Share this post


Link to post
Share on other sites

Yeah I have to include IE support soon.... will try to spare some time to make an update

  • Like 2

Share this post


Link to post
Share on other sites

Add dimensions to the logo image element and it will fit in nicely :)

 

Hello I have the same issue, was not able to find logo image dimension on css file

www.kciee.com

 

All i was able to find was :

#header_logo{display:block;float:left;margin-top:13px;}

i tried doing 0px in margin but no effect

Pls Help !!

 

 

2. A small bug I have noticed that where the product name is long usually after second line in the defult theme we get ...(three dots) but here in this theme I am getting broken letters and no ...

Edited by mankomal (see edit history)

Share this post


Link to post
Share on other sites

Hello everybody, how can i add a backgroun image?

 

Many thnaks! :)

Problem solved! ;)

 

I've got a question:

when I add more product in home I've got this huge space between the product and the footer, as you can see in the image below. Does someone know how can I solve this problem?

 

Many thanks! :)

x44v.png

  • Like 1

Share this post


Link to post
Share on other sites

Hi Fredddie1946,

 

As you're using the 2-column option, try adjusting the number of items per line from 4 to 5 in line 32 of \themes\default\modules\homefeatured\homefeatured.tpl.

  • Like 1

Share this post


Link to post
Share on other sites

Hi Fredddie1946,

 

As you're using the 2-column option, try adjusting the number of items per line from 4 to 5 in line 32 of \themes\default\modules\homefeatured\homefeatured.tpl.

 

Great, it works!!!

You rock my friend!!!

 

Thanks a lot!!!

 

If I can, why the product's title in home doesn't appear totally?

 

uv9a.png

Edited by freddie1946 (see edit history)

Share this post


Link to post
Share on other sites

Can someone help me to fix the cart button display issue? The problem is in Categories, in the actual Product page it is OK (or at least I could fixed it by adding a few blank spaces in the Translation.. :))

 

7-12-20139-38-33PM.png

 

Even if I change the font size it still overlaps the first letter.

 

Also, I have another question:

I tried to change the font but it always display Arial... What am I doing wrong?

 

//font
@import url(http://fonts.googleapis.com/css?family=PT+Sans+Narrow&subset=latin,latin-ext);
//Base variables
@color1: #444; //menu, some tables headers, and where dark color is needed
@color2: #F15A23; // The main color of the theme
@color3: #EEEEEE; // light color used mainly for some borders
@colorbtn: #F15A23; // the color of the buttons, button gradient, borders and hover state are automatically generated out of it
@bgcolor: #F8F8FA; // the body background color
@textcolor: #555555; // main text color
@textcolor2: #666; // lighter color for few texts
@fontfamily: "PT Sans","Trebuchet MS",sans-serif; // the main font family
@submenuwidth : 160px; // width of the submenus under the top horisontal menu
@block_head_background: transparent;
.block_head_border{   border-bottom: 2px solid @color2;

 

Thank you,

Nicu.

Edited by nzecheru (see edit history)

Share this post


Link to post
Share on other sites

Freddie1946, I think what I did to get the full product name was to amend the line in cleantheme.css that begins with '#featured-products_block_center .s_title_block' (looks like line 81 for you).

 

Change the values for text-overflow from 'ellipsis' to 'clip' and change the white-space value from 'nowrap' to 'normal'.

 

Hope that works for you.

 

Thanks Dave

  • Like 1

Share this post


Link to post
Share on other sites

Freddie1946, I think what I did to get the full product name was to amend the line in cleantheme.css that begins with '#featured-products_block_center .s_title_block' (looks like line 81 for you).

 

Change the values for text-overflow from 'ellipsis' to 'clip' and change the white-space value from 'nowrap' to 'normal'.

 

Hope that works for you.

 

Thanks Dave

Stottycabanas thanks for the post

Solved for me

 

Can any one help in positioning and sizing of logo in the theme its giving me problem

check www.kciee.com

  • Like 1

Share this post


Link to post
Share on other sites

Freddie1946, I think what I did to get the full product name was to amend the line in cleantheme.css that begins with '#featured-products_block_center .s_title_block' (looks like line 81 for you).

 

Change the values for text-overflow from 'ellipsis' to 'clip' and change the white-space value from 'nowrap' to 'normal'.

 

Hope that works for you.

 

Thanks Dave

 

You are my hero!!!

 

IT WORKS!!!

 

Thanks!!!!! :)

Share this post


Link to post
Share on other sites

Anyone has any ideas how to fix this?

 

Thanks,

 

Can someone help me to fix the cart button display issue? The problem is in Categories, in the actual Product page it is OK (or at least I could fixed it by adding a few blank spaces in the Translation.. :))

 

7-12-20139-38-33PM.png

 

Even if I change the font size it still overlaps the first letter.

 

Also, I have another question:

I tried to change the font but it always display Arial... What am I doing wrong?

 

//font
@import url(http://fonts.googleapis.com/css?family=PT+Sans+Narrow&subset=latin,latin-ext);
//Base variables
@color1: #444; //menu, some tables headers, and where dark color is needed
@color2: #F15A23; // The main color of the theme
@color3: #EEEEEE; // light color used mainly for some borders
@colorbtn: #F15A23; // the color of the buttons, button gradient, borders and hover state are automatically generated out of it
@bgcolor: #F8F8FA; // the body background color
@textcolor: #555555; // main text color
@textcolor2: #666; // lighter color for few texts
@fontfamily: "PT Sans","Trebuchet MS",sans-serif; // the main font family
@submenuwidth : 160px; // width of the submenus under the top horisontal menu
@block_head_background: transparent;
.block_head_border{   border-bottom: 2px solid @color2;

 

Thank you,

Nicu.

Share this post


Link to post
Share on other sites

Hello guys,

just posted latest update of the theme

 

here is the changelog:

 

-Prestashop 1.5.4.1 fixes

 

-updated example header.tpl - plug and play on 1.5.4.1

 

-Added logo and menu vertical position variables

 

-few small bug fixes

 

-theme split in 2 files for easy manage and updates

 

-added cleantheme class for easy switch on/off

 

-IE buttons bugfix

 

-added try-out panel on the demo

 

Download here -> http://webiz.bg/cleantheme/LESS-CleanTheme.rar

 

 

I'm open to any suggestions about the theme, new variables, different styles somewhere or whatever :)

 

 

Also, what do you think about the idea making this theme as a module with admin panel customization with color pickers google font-api and etc. ?

  • Like 2

Share this post


Link to post
Share on other sites

Hi, how can i get products list in a grid? thnks

Did you tried opening the file called INSTRUCTIONS.txt ?

If you didn't, you should definitely give it a shot ;)

Edited by Snade (see edit history)

Share this post


Link to post
Share on other sites

Hi, yes, i have changed in header but still not working.

 

I just like to get products list like this:

 

http://demo-store.pr...p.com/en/9-food

 

thnks

Flávio

and did you followed what you've read, and turn force compile to on? BackOffice -> Advanced Parameters - > Performance

 

Currently you site load default theme without any changes, you have either did not made the changes, or you did the changes but the new .tpl file is not compiled

Share this post


Link to post
Share on other sites

So you actually want to get RID of the grid , and have a list instead. Just remove the class grid from your body tag

 

Also,

in order to fix your search button add this to your css (global.css or cleantheme.less and you'll have to compile the less file in css)

 

.cleantheme #search_block_top {
width: 420px !important;
}

 

Also add short description to your products

Edited by Snade (see edit history)

Share this post


Link to post
Share on other sites

Hi, thanks solved :)

 

Another question, how can i get all product title showing in product list?

 

I have edited css and in homepage shows fine.

 

thanks

Flavio

Share this post


Link to post
Share on other sites

For this you'll have to edit your product-list.tpl file

around line 44, increase the truncate value to whatever you wish

{$product.name|escape:'htmlall':'UTF-8'|truncate:35:'...'}

Share this post


Link to post
Share on other sites

tumblr_mp9fgv4adX1ql2603o1_500.jpg

 

 

Guys and gals, now you can support the project with coffee or pizza using the donate button in the demo :) That way I will be able to work less for clients and more for creating free content and supporting the community

 

Thank you very much for your support

Edited by Snade (see edit history)
  • Like 2

Share this post


Link to post
Share on other sites
How can i change the color text of "BROWSE THE MOBILE SITE" in the footer?

 

Look in global.css for the line starting: #footer a {color:

  • Like 2

Share this post


Link to post
Share on other sites

Look in global.css for the line starting: #footer a {color:

 

It wooooooooorks!!! Thanks stottycabanas you solved a lot of my question in a very simple way!!! ^_^

Share this post


Link to post
Share on other sites

It wooooooooorks!!! Thanks stottycabanas you solved a lot of my question in a very simple way!!! ^_^

 

No problem Freddie, that's just the way these forums work, I guess, try & help each other out.

Share this post


Link to post
Share on other sites

so i'm having trouble even getting the skin/template installed. I uploaded css to proper directory, included line in header, forced compiled and got nothing. Guess I'm having a brain fart on the last set of instructions. Do I not just select force compilation and save?

Share this post


Link to post
Share on other sites

so i'm having trouble even getting the skin/template installed. I uploaded css to proper directory, included line in header, forced compiled and got nothing. Guess I'm having a brain fart on the last set of instructions. Do I not just select force compilation and save?

If you use 1.5.4.1, just copy the provided header.tpl and you should be good to go.

 

In the manual install, you may be missing to add classes to the body tag - cleantheme two_col grid

 

Give link if you still have rpoblem so we can actually see what is going on in order to help you :)

Share this post


Link to post
Share on other sites

If you use 1.5.4.1, just copy the provided header.tpl and you should be good to go.

 

In the manual install, you may be missing to add classes to the body tag - cleantheme two_col grid

 

Give link if you still have rpoblem so we can actually see what is going on in order to help you :)

 

Thank you, it's now working!

  • Like 1

Share this post


Link to post
Share on other sites

Hi Snade,

 

Congratulations. This is a brilliant idea. I agree that too many themes - free or otherwise - are overkill. What you've done by cleaning up and polishing the default theme and making it easy for a beginner to adjust the color scheme is all most people will need. I, for one, don't want the theme to overpower the products, so I consider your idea to be the perfect solution.

 

I have one problem and two questions. My problem is that the "Continue Shopping" button on the cart view page has white text on a white button. It's hard to read until the button turns color when in the hover state. In other words, the hover state seems to work fine. I've tried to change the button color, but when I did, the color of the text on the "Check Out" button in the drop down cart view also changed at the same time. So, when one button is readable, the other is not. One or the other will have text that is too close to the button color.

 

Now for the questions. How do I make the menu into a gradient like the buttons? That would be really nice to know and I would probably not touch the theme again if I could accomplish that. Second, when you say in the theme description in your first post that it's easy to change colors, you mention 3 specific color combinations. Is there a way to quickly change between color combinations, or is it necessary to enter the color codes? I just entered the color codes for the combination I wanted, which was not one of the 3 combinations you referred to in your post.

 

Also, I think that having the customization options available from the admin panel (as you mentioned in your last post) would be awesome. It would make the theme popular even with people who are unwilling to touch the theme files. It should really be included in PrestaShop by default. I think Shopify has something similar built in.

 

Thanks for your hard work.

 

Stephen

Edited by PrestoStore (see edit history)

Share this post


Link to post
Share on other sites

I just uploaded the new files (header.tpl and cleantheme.css) you posted on 07/13/2013. I'm happy to say that the "Continue Shopping" button is fixed (by the way, I'm talking about Firefox, not IE).

 

Unfortunately, the "Search" button in the header is now placed under and aligned with the left side of the search box.

 

Any help with this and with the menu gradient would be appreciated.

 

Thanks again,

Stephen

Share this post


Link to post
Share on other sites

@PrestoStore

 

I have to make another update, because there is inconsistency between the dom element that use the button classses. Some are input, some are <a> and some <button>. For modern browsers its not an issue but IE have its own opinion about the different types of buttons. Will fix this soon

 

for the search button again I have to make an update , now the space is sometimes not enough.

use this code to make enough space

.cleantheme #search_block_top {
width: 420px !important;
}

 

 

 

it is possible to make the menu gradient, but you'll have to play more with the css. I will include this as a feature request and will try to make it possible for the next update.

 

The color combination switching is also on the list for the next update.

Share this post


Link to post
Share on other sites

Hello Snade

 

Nice man. You did it for IE. It was really nice except the Add to Cart and Search button. Everything was good. Please see if these can be fixed too.

Share this post


Link to post
Share on other sites

In answer to post #162:

 

Nicu, try editing the product-list.css and comparator.css files in \themes\default\css as follows:

 

Look for '.ajax_add_to_cart_button' and '.ajax_add_to_cart_button span'. Replace existing code with

 

.ajax_add_to_cart_button {

position: absolute;

top: 0px;

height: 21px;

left:19px;

width: 94px;

margin-left:9px;

padding-left:18px !important

}

.ajax_add_to_cart_button span {

display: block;

position: absolute;

top: -1px;

height: 26px;

left: -30px;

width: 26px;

background: url(../img/icon/pict_add_cart.png) no-repeat 0 0 transparent

}

span {

left:18px

}

 

May not be very elegant, but it seemed to do the trick (for product comparisons anyway - I don't display products at category level, so haven't confirmed for the category page.).

 

HTH, Dave.

Share this post


Link to post
Share on other sites

@Generaal

 

I'm not quite sure what exactly youre asking me, but will try to answer.

 

This skin is made for the default theme and you should use it. In order to look as on the demo you need the default modules configuration, but if you havent moved any modules dont worry about this.

 

If you upgrade from 1.5.4.0 to 4.1 adn you uprage the defaulth theme also, you'll have to integrate the skin again by adding the 1 line of code in header.tpl

 

Hope that helps

 

I disabled some of my modules (no use for them) before I tried your css and now I know why it's not really doing anything (except breaking the default search button). Is there a way to get this to work in a configuration that isn't exactly as default? And if there is a way, what if in the future you add/remove a module, will it break again?

Share this post


Link to post
Share on other sites

Hi there and many thanks for this nice theme! Great Work.

 

but i have a littel problem with it. I just made a fresh install of the latest version of Prestashop and did exactly what you say in your instructions.

 

Problem 1: If i copy in the default header.tpl after {$HOOK_HEADER} <link rel="stylesheet" type="text/css" href="{$css_dir}cleantheme.css" /> than just nothing happens execpt of that the search bar is slighted to the right. Using Notepad++

 

Problem 2: If i copy your header.tpl than the theme changes but only in the two colum view... but i need the 3 colums..

 

Problem 3: The Cart Grafic is overlaping the Prices at products.

 

Problem 4: I assume that the Font size can be changed at the CSS File that you provided or must it be changed in the LESS file and than been compiled?

 

Testet with IE 9 and Firefox..

 

Whould be great if you could help me because your theme is exactly what i need!

Share this post


Link to post
Share on other sites

hello

thank you very much first for the very nice work. I really appreciate it. But i'm still unable to make it work even if i followed all the instructions.

waiting for your kind reply...

thank you

Share this post


Link to post
Share on other sites

I disabled some of my modules (no use for them) before I tried your css and now I know why it's not really doing anything (except breaking the default search button). Is there a way to get this to work in a configuration that isn't exactly as default? And if there is a way, what if in the future you add/remove a module, will it break again?

The theme is compatible with every module and position that comes with prestashop, so you can do everything as on a normal defaulth theme.

 

Hi there and many thanks for this nice theme! Great Work.

 

but i have a littel problem with it. I just made a fresh install of the latest version of Prestashop and did exactly what you say in your instructions.

 

Problem 1: If i copy in the default header.tpl after {$HOOK_HEADER} <link rel="stylesheet" type="text/css" href="{$css_dir}cleantheme.css" /> than just nothing happens execpt of that the search bar is slighted to the right. Using Notepad++

 

Problem 2: If i copy your header.tpl than the theme changes but only in the two colum view... but i need the 3 colums..

 

Problem 3: The Cart Grafic is overlaping the Prices at products.

 

Problem 4: I assume that the Font size can be changed at the CSS File that you provided or must it be changed in the LESS file and than been compiled?

 

Testet with IE 9 and Firefox..

 

Whould be great if you could help me because your theme is exactly what i need!

To have 3 columns remove the class two_col from the body element

The problem with the cart will be fixed in next release

 

better change the font size in the less

 

hello

thank you very much first for the very nice work. I really appreciate it. But i'm still unable to make it work even if i followed all the instructions.

waiting for your kind reply...

thank you

Maybe you did not turned force compile to On ? (tools-> performance)

 

 

There are couple of known bugs that I have to fix. The theme is close to really working state, but I have to spare some time to fully finish it.

 

Please report any kind of bugs you notice. The best report will be direct link or atleast screenshot. Thanks :)

Share this post


Link to post
Share on other sites