Tutorial how to make/Edit a template

[Bjornher]

Hi all!
Iam soo new to Presta and I need to now how to modify a template or to create my own!

Is there already a thread about this? Can't find any.

[Static]

Hi Bjornher

All you need to do is make a copy of the prestashop theme folder and re-name it to something else and then edit the global.css and whatever images you need.

hope this helps

[Bjornher]

OK thanks, let me try doing that. But If I want to make it look completely different a lay-out that I need. Put the Shoppingcart in a different place etc...?

[kiwiacw]

Some of those simple things can be acheived in your back office admin area. Go to the modules tab and you can change the position of these by changing which column hook they are in and which position in the column they are placed.

[Mario]

Hi

Hope I'm allowed to ask another question in this thread about customazing a web shop.

I'm already changing the look in the .css file and have realized, that I can move some blocks through the admin area...

I'd like to move something that is not in the module blocks.

I want to move arround the header.
(www.cuoresportivo.ch/cs-web-shop)
I already changed the header, so that the logo is on top and the currency, language, contact, sitemap, bookmark and the search bar is on one line.
How can I bringt up to the also the "Willkommen, anmelden" block?

I really do not know, where I can set this up, as I do not finde anything in the .css.

Please advise..

Thanks

Mario

[Static]

Hi mario

Open global.css and around line 820 you will find:

/* block top user information */
#header #header_user {
   width: 99%;
   text-align: right;
   clear: left;
   margin:0.6em 0.6em 0 0;
}

If you remove the "width:" and the "clear:" it should bring it up inline with the others.

Hope this helps

[Mario]

thanks a lot...

exactly what I needed...

sorry... i thought i has to be at the same line where I could move arround the other stuff...

I was not so far down in the global.css....

Next time I will be more patient...

[sperio]

make your pseudo changes in FIREFOX with FIREBUG... it will make things go much simplier... remember to check your changes in IE also... spent lots of time debugging IE issues which I would have caught if I had checked in IE as I went along... NOTEPAD++ was a lifesaver to make code comparison and track changes...

have fun and lots of caffine

cheers
alfred

[Mario]

thanks...

I'm using the editor from xplorer...

[munchie75]

Hi,

I've heard about the editor for xplorer, which i presume you mean IE ??

Can you post a link as to where i may download it from.
I already use firebug, and think it's fab, so would love the same tool for IE.

Many thanks

Andy

[sperio]

they have the same thing for IE using FIREBUG but it is a pain to install... i would rather do the changes in FF and then see what else to change for IE

[mdg]

Hi I am new to Prestashop, but I can't find anything like this in the Moduels section

"Go to the modules tab and you can change the position of these by changing which column hook they are in "

Where and what am I looking for?

Thanks

[sperio]

positions tab in modules... a bit non obvious...but once u see it... it clarifys

[QuadDamage]

  Quote

maybe one year late to answer but presta is the best , i have had it for like one day now.. all you have to do is get DREAMWEAVER and open the theme folder with it and edit. easy as hell. :-)

Can you explain exactly what you mean by that? You cant open a folder in Dreamweaver. Only files.
Which to me, is as useful as a text editor. Is there anyway to open a theme in Dreamweaver and see the actual theme you can edit?

[scottyboy]

yes, I too would love to know how you managed to do this in dreamweaver without editing every individual file?

[elios1]

I would like to use prestashop template but with logo 600x100 pixel. How to do this that logo doesn't come over a few header modules?

[elios1]

I solved this in global.css changing margin-top: 0.5em to margin-top: 1.8em

h1#logo {
   float: left;
   width: 27%;
   margin-top: 1.8em

[elios1]

Now new problem. I muved "Permanent links block v0.1" just below "User info block v0.1" but the problem is that "Permanent links block v0.1" has top center position not top right (I want it to be just below "User info block v0.1" (at right position)). I looked at in php code of both module and cannot find what makes "User info block v0.1" to be right and how to put "Permanent links block v0.1" also right. What I have to change in a code of module and in what file?

[elios1]

I solved this in global.css changing float: left into float: right

/* top links */
ul#header_links {
   margin: 0.4em 0.3em 0 0;
   list-style-type: none;
   float: right

[Sean-Irl]

OK I give up, putting a gun to my head. This is a fantastic shop, love everything about it, except trying to understand it. Maybe I have just realised how dumb i really am because reading the posts everyone else seems to get it . Hanging my head and returning to OS at least I can edit that.
bye bye woderful new UNTOUCHABLE world.

[CalloSmart]

  Quote

Hi all!
Iam soo new to Presta and I need to now how to modify a template or to create my own!

Is there already a thread about this? Can't find any.

Hi,

I have over 13 years of software development in Microsoft based software development technologies. But I am a newbie to PHP and especially to Prestashop framework. I am learning the framework and in the process, started to write a series of posts(Creating a Prestashop 1.4 theme from scratch) to outline the creation of a new Prestashop theme using Visual Studio and other tools. The posts primarily are targeted towards a PHP/Prestashop newbie.

Please visit Creating a Prestashop 1.4 theme from scratch and share my experiences through my learning phase. I hope active participation from other novice Prestashop programmers like me and advices from Prestashop experts to make the posts helpful for others who require it.

[StuPidBoy]

I am just wondering, For people who do not have coding experience or programming knowledge like me, is there any drag and drop editor that i can use to modify/create the prestashop theme?

[Henrik Pantle]

some provide it with their custom themes.

 

but i could not find any tool for general theme editing. guess the developers do not provide because they wanna sell the themes.

 

but what i'm searching is a list of the values and a screen shot what they represent.

 

any glue?

[optizyme]

Hello,

 

I want to put an image background of the default theme like this :

 

http://image.shutterstock.com/display_pic_with_logo/586348/586348,1298760622,1/stock-photo-white-golf-ball-on-green-grass-isolated-on-white-with-shadow-background-for-web-page-72014188.jpg

 

How can i do this? I have no experience on css and i opened global.css with no clue..

 

Thanks in advance

[Andrej Stas]

  On 1/3/2009 at 2:36 PM, Bjornher said:

Hi all!

Iam soo new to Presta and I need to now how to modify a template or to create my own!

 

Is there already a thread about this? Can't find any.

 

Hi,

 

if you want to "create your own theme" - our new project will be released as soon as PS 1.5 comes out:

 

Presta-theme-maker.com

 

Hope you will like it!

Edited February 25, 2013 by Andrej Stas (see edit history)

[Wn-nook]

  On 1/3/2009 at 3:44 PM, Static said:

Hi Bjornher
All you need to do is make a copy of the prestashop theme folder and re-name it to something else and then edit the global.css and whatever images you need.
hope this helps

Where I will find global.css

Expand