Standard Grey font for paypal and contact us form

  • 1
  • Problem
  • Updated 7 years ago
  • Solved
Hello, is there a way to change the contact us font colour and the paypal font colours from the standard grey? I find it is dissapearing into my dark background and would Ideally like the text to be another colour. Can you help?
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes

Posted 7 years ago

  • 1
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Hello Maria,
Could you tell us your URL and the Style name and are you a Silver subscriber?
Thanks.
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
Hello,

URL is www.lasignorina.co.uk (if you click on contact us and shop pages)

i'm a bronze member...

thank you..
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Is this the kind of thing that you wish?




{Click the image to enlarge to screen size}
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
yes! that would be brilliant!! would like the same on the shop page too! :)
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Hi Maria,

Would you try inserting this piece of code please into an HTML widget and place it at the top of your pages. I'm not compeletely sure this will work as it seems to inherit the code from these lines rather than an explicit statement for this occurence. Anyhow try it and see how you go. Best to do this on a duplicate page as a test page first.


td, tr {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 12px;
color: #333333;
}


The color: #333333 is the code for the dark grey and can be replaced with any vaild hex color code. The code for white is #ffffff Other codes can be found on various sites such as: http://www.december.com/html/spec/col...
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
I tried... :( it's not working :(
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
OK. Maria. I'm really sorry.

Can you try this extended code and see if this helps. Replace the one you just added with this. I've already set the font code to white.


element.style {
line-height:normal;
}
td, tr {
color:#FFFFFF;
font-family:'Lucida Grande', 'Arial Unicode MS', sans-serif;
font-size:12px;
}


I'll wait here for a while watching for a response if you like :(
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
Hi,

Still no luck... i've attached a snapshot of what comes up...

Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
OK. Is the code still on your page and have you published? I can see from here what may have happened if it is published.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
maria,

Keep the last code in place and I'll step up another level and see if this effects the change:

Add another HTML widget above the first and paste this code into it.


body {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 12px;
color: #FFFFFF;
background-color:#330508;
background-image: url(resources/goldlabel.jpg);
background-repeat:repeat-x;
background-position:top left;
background-attachment:scroll;
}


I'm being conservative rather than trying shotgun.
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
Hi Gop,

I have published both... still no joy...
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Thanks Maria,

I can change it on my browser with a utility I have and it indicates those places where i suggested that you made the change. I usupect that the style CSS is over-riding any local change we make because we can't get up that high in the style without going into the head of the document and you can't do that with Bronze.

Can I leave this for another person like Sanja or another who knows more than I obviously don't, to have a look at when she or they comes on deck?

I'm really sorry to have wasted your time on this and I really hope that you get a solution very quickly.

Gop.
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
Thank you Gop... appreciate the help..
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Hi Maria,

There was one thing I overlooked in the pasting of the code and that was the style statement. We need to start the code with style type and then at the end finish the statement. So what's new is the first line and the very last line.

Can you paste:

<style type="text/css">

body {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 12px;
color: #FFFFFF;
background-color:#330508;
background-image: url(resources/goldlabel.jpg);
background-repeat:repeat-x;
background-position:top left;
background-attachment:scroll;
}

element.style {
line-height:normal;
}
td, tr {
color:#FFFFFF;
font-family:'Lucida Grande', 'Arial Unicode MS', sans-serif;
font-size:12px;
}

</style>
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
Miracle!!!! It worked!!!!! yay! thank you so much!

One more thing... I was able to change the paypal grey text using this code but it doesn't seem to work on the blog page... can you help with this one too?

Thank you sooo much!!!
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Maria,

Very glad it worked. The blog is a little different. Do you know what style of template you are using; maybe "Squeaky Clean" ?

I will need to do a little work on this and get back to you if that's OK?

Maria if you are using Firefox then it's really worthwhile downloading Firebug which is an add on utility. There are a few really good vid tuts on U-Tube showing you how to use it. This is how I was able to identify where the code was that affected the colour on your pages.

If you are using Chrome then you can download Firebug Light for Chrome. A little less powerful but still quite good.

If you are using IE for creating Yolasites then most would say "Don't!" :) although with every new version it does become more inline with the other big players and has less and less anomalies. I don't like bashing IE but it is quite difficult getting cross-browser effectiveness when using it as your creator browser, plus there's no Firebug for it.
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
hello Gop i'm using the Clean slate template...

not sure i understand how to use Firebug and what it is for... but yes i'm using Firefox...

thanks will wait for your fixer for the blog page. Thank you! Thank you!
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Firebug is a tool to allow you to see the code on a page either published or preview. If there is something that isn't right you can analyse it simply by highlighting the element on the published page and it shows you the associated code.

You can then make a change to the code on the published and live page and it it shows you the effect immediately. If you tinker with the code then you can copy it directly and return to the site builder to replace the wrong code.

For me that is it's real power but I know it's only a tiny aspect of the overall ability of firebug.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Think this will work on your Blog page. I've added a bit for you to check on at the end of this.

<style type="text/css">

.sys_txt a:link {
color:#ffffff;
text-decoration:underline;
}
.sys_txt {
color:#ffffff;
font-family:'Lucida Grande', 'Arial Unicode MS', sans-serif;
font-size:12px;
}
</style>


Maria, could you just create a dummy post and subscribe to it by RSS and check it out. It's worthwhile checking that this works properly with this change. Let me know.
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
hello Gop,

it didn't work... is it missing the style code maybe?
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Where is my head? Yes of course. I'd swear I put that together.........Sorry. I've amended the post.
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
Hello Gop,

97% of it seems to have worked! yay! only thing left in grey is the part that says subscribe to this blog... will that need a separate code?
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Probably. That's the RSS feed subscription icon?
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
yes, it's next to the icon..
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
For your RSS feed announcement:


<style type="css/text">
a:link {
color:#ffffff;
text-decoration:none;
}
a:visited {
color:#ffffff;
text-decoration:none;
}
a:hover {
color:#edcf8a;
text-decoration:underline;
</style>
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
I tried that.. it doesn't seem to work... :/
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Try this which is the same with a couple more lines added.


<style type="css/text">
td, tr {
color:#ffffff;
font-family:'Lucida Grande', 'Arial Unicode MS', sans-serif;
font-size:12px;
}

a:link {
color:#ffffff;
text-decoration:none;
}
a:visited {
color:#ffffff;
text-decoration:none;
}
a:hover {
color:#edcf8a;
text-decoration:underline;
</style>
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
If it doesn't work Maria then try adding an HTML widget to the top of the Right hand side division if you can.
Photo of Maria

Maria

  • 16 Posts
  • 0 Reply Likes
it doesn't seem to like it... I tried top right, no joy either...
thank you so much for all the fixing you have helped me with today though! My pages are looking so much better! I really appreciate it!
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
&^#*!!

There is one other alternative and that is to change your style to Clean Slate Black. This has a default text colour of white.

You would only need to re-apply your banner as everything else will be carried through.

This has only come to light since you advised me of your style selection.
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Thanks Gop for all your efforts on this! It's really appreciated!