Zen Cart Logo
Forums / Basic Configuration / facebook link in header

facebook link in header

Views: 1,347

Results 1 to 10 of 10
18 Jul 2014, 3:00 PM
#1
stitchnkitty avatar

stitchnkitty

Totally Zenned

Join Date:
Jun 2009
Location:
Des Moines, Iowa USA
Posts:
618
Plugin Contributions:
0

facebook link in header

I have been reading how to do this and came across a conversation supported by Kobra.

Had a Q? about the stylesheet coding.

I will want this on the left next to the login link
https://www.stitchnframeonline.com

include/templates/my_templates/css/stylesheet_tm.css :

Code:

#header .facebook {padding:10px 10px 10px 10px}

This is a 2011 posting and I dont know how it will fit into the 1.5.1 version since it does not APPEAR that I have a stylesheet_tm.css in either the classic or the my templates.
Has this changed in the new version and can someone help me with the coding...I attempted the addition and without adding in the coding in the stylsheet, the appearance of my page went berserk (big surprise!)

18 Jul 2014, 5:20 PM
#2
stevesh avatar

stevesh

Black Belt

Join Date:
Feb 2005
Location:
Lansing, Michigan USA
Posts:
19,793
Plugin Contributions:
2

Re: facebook link in header

You won't have a stylesheet_tm.css unless you buy a template from Template Monster. Did you try adding that statement to stylesheet.css?

23 Jul 2014, 4:06 PM
#3
stitchnkitty avatar

stitchnkitty

Totally Zenned

Join Date:
Jun 2009
Location:
Des Moines, Iowa USA
Posts:
618
Plugin Contributions:
0

Re: facebook link in header

No I have not - but I will certainly give it a try... I am also suspecting that my pic was too big at 100x100

23 Jul 2014, 8:05 PM
#4
stitchnkitty avatar

stitchnkitty

Totally Zenned

Join Date:
Jun 2009
Location:
Des Moines, Iowa USA
Posts:
618
Plugin Contributions:
0

Re: facebook link in header

Still messing with this - have to do some other things and will be back but what I have done so far is:

css:
#mainWrapper {
background-color: #dbefdb;
text-align:center;
width: 900px;
vertical-align: top;
border: 1px solid #9a9a9a;
}

#header .facebook {align:center;  padding:10px 10px 10px 10px} 

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin: 0em;
padding: 0em;
}

image is not there and I would like the image nest to the login or maybe a bit to the right of login..

https://www.stitchnframeonline.com

23 Jul 2014, 8:21 PM
#5
stitchnkitty avatar

stitchnkitty

Totally Zenned

Join Date:
Jun 2009
Location:
Des Moines, Iowa USA
Posts:
618
Plugin Contributions:
0

Re: facebook link in header

oh and the body on the page is supposed to be green and not gold.

23 Jul 2014, 10:51 PM
#6
stevesh avatar

stevesh

Black Belt

Join Date:
Feb 2005
Location:
Lansing, Michigan USA
Posts:
19,793
Plugin Contributions:
2

Re: facebook link in header

It may be your file edits aren't 'taking'. When I look at your stylesheet.css file, the background color for the body is:

body {
margin: 0;
font-family: comic sans Ms, ravie;
font-size: 100%;
color: #000000;
** background-color: #f7cb97;**
}

which is gold. check your file permissions to make sure the files you're trying to edit are writable.

24 Jul 2014, 3:53 PM
#7
stitchnkitty avatar

stitchnkitty

Totally Zenned

Join Date:
Jun 2009
Location:
Des Moines, Iowa USA
Posts:
618
Plugin Contributions:
0

Re: facebook link in header

yes the edge is gold and down the center is green as shown in the area where our hours are..
I am wondering if this may have something to do with sizing of the pic.. I have been trying to read about css coding and am just starting to understand some of it but.... I am wondering it the padding code is what I need... since that was copied for someone elses post... HMMMM!

24 Jul 2014, 5:00 PM
#8
stitchnkitty avatar

stitchnkitty

Totally Zenned

Join Date:
Jun 2009
Location:
Des Moines, Iowa USA
Posts:
618
Plugin Contributions:
0

Re: facebook link in header

Ok coming along - have the image but my body is still gold and would like the facebook a bit right of the login but not crowding it.

#header .facebook {align: auto;
}

24 Jul 2014, 6:56 PM
#9
stevesh avatar

stevesh

Black Belt

Join Date:
Feb 2005
Location:
Lansing, Michigan USA
Posts:
19,793
Plugin Contributions:
2

Re: facebook link in header

Looking at your source, there doesn't seem to be any 'facebook' class, so that styling won't apply. You'll need to enclose your Facebook image in a <div> with the class name 'facebook'.

Also, as I pointed out, your stylesheet 'body' rule currently sets the body background color to f7cb97, which is gold. You'll need to change that to some color green in stylesheet.css.

30 Jul 2014, 5:29 PM
#10
stitchnkitty avatar

stitchnkitty

Totally Zenned

Join Date:
Jun 2009
Location:
Des Moines, Iowa USA
Posts:
618
Plugin Contributions:
0

Re: facebook link in header

Ok got the color back - it actually was a duplicate </div></div> that messed things up.. creative copy paste is not good!
TY Stevesh