Jump to content

How to change the design of footer? (I want to design my own footer based on default)


Recommended Posts

Problem #1

I'm a newbie wanting to design my own footer for a school project but have no idea how to do so. I'm trying to edit things of the default footer such as:

  • Colour
  • Padding/Shadow
  • Text positions/Font
  • Adding image

Knowing how to change it to something like http://happycog-sansom.myshopify.com/ would be good enough.

 

My questions:

  • What files do I have to change to achieve the above? Global.css? A module's css?
  • Any tips for the design of the footer?

Hope any pros will be offer some insight, thanks!

 

--------------------------------------------------------------------------------------------------------

Problem #2 (SOLVED)

In addition, how do I edit these texts/links(what are they really called?). There seems to be a lot of conflicting information regarding this, such as editing:

  • footer.tpl
  • blockvariouslink(couldn't even find this in my modules)
  • global.cs

Which one is it?

1Untitled_zpsd1887334.png

--------------------------------------------------------------------------------------------------------

Problem #3

post-395609-0-22061900-1358613361_thumb.png

I got into a minor problem here, I can't seem to change the dark grey colour to a colour I want as seen in this picture, went around global.css and blockmyaccount.css but am still unable to change the dark grey.

post-395609-0-96829800-1358613355_thumb.jpg

Also, I would like to change the "MY ACCOUNT" text to something resembling one of these buttons, how would I do this? Add something like:

background: url(www.picture.com/mypicture.jpeg);?

Edited by mechwr (see edit history)

Share this post


Link to post
Share on other sites

try to read prestashop tutorials so you get a bigger picture of how to work with prestashop.

you can start here: http://doc.prestasho...age+using+hooks

 

basically you don't need to edit footer.tpl, the only thing that footer.tpl does is to call for modules in the right column and the footer.

to edit/change style in the footer, look for #footer in global.css (located at 'themes/default/css').

some module comes with there own css file that usually located in the module folder.

 

the block various links in footer is part of block cms. if you go to the module configure in back office you will see the module options.

the other module you marked in problem #2 is called block reinsurance

Edited by yaniv14 (see edit history)

Share this post


Link to post
Share on other sites

Problem #2

In addition, how do I edit these texts/links(what are they really called?). There seems to be a lot of conflicting information regarding this, such as editing:

  • footer.tpl
  • blockvariouslink(couldn't even find this in my modules)
  • global.cs

Which one is it?

1Untitled_zpsd1887334.png

 

Problem 2..

upper row. module "block reinsurance"

left column. module "myaccount block on footer"

center column. module "block social"

right column. module "block contact infos"

 

you may edit the text at those modules.

Share this post


Link to post
Share on other sites

I've tried your

 

you are missing the " ' " in the background url:

 

you have: background: url(your_image)

you should have: background: url('your_image')

 

but it still doesn't work, I looked around my global.css file to find an example of how the background: url code is implemented properly as seen in my uploaded png file but nothing changes.

The grey "ACCOUNT" area of problem 3 still can't be changed!

Can someone help me with this? It doesn't seem to want to change no matter what I do!

 

 

Also, it also seems the ' doesn't matter in using a background url code as there seems to be some lines in the global css which uses it and others that don't can I also get a comment on this too?

post-395609-0-23430800-1358761962_thumb.png

Edited by mechwr (see edit history)

Share this post


Link to post
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More