Warning: Cannot modify header information - headers already sent by (output started at /home/jerwon11/divtagtutorials.com/wp-content/plugins/captcha/captcha.php:1) in /home/jerwon11/divtagtutorials.com/wp-content/plugins/wp-super-cache/wp-cache-phase2.php on line 60
Weebly Footer - How to Change Link Colors

How to Change Link Colors in Footer

The darg & drop footer is an unique feature of DivTag templates.  So when changing the Link Colors of the footer text, you can do so by going into the W Theme Editor.

1) Access the W Theme Editor by clicking on the Design 

Click on “Design” and then on “edit html/css” tab

theme-code-editor

 

2) Locate Footer Customization CSS

In the Main_style.css, scroll down to near the bottom of the page and locate this set of code:

NEW EDITOR

NEW EDITOR

OLDE EDITOR

OLDE EDITOR

#footer a, #footer a:active {
color: #026e75; /*Change footer link color here*/
text-decoration: underline;
}

#footer a:hover {
color: #0397a1; /*Change footer mouse over hover link color here*/
text-decoration: none
}

#footer a:focus, #footer a:visited {
color: #779b1f; /*Change footer visited link color here*/
text-decoration: underline
}

*IMPORTANT*Depending on your theme you the text in RED may look different. The may be nothing in the red text area.

*IMPORTANT*If you DON’T see the codes in your theme, you can COPY the sample code from the tutorial and paste it in the main_style.css BLANK area. This will add the specific footer link code that you can then customize.

3) Change Link Color for Footer Text

#footer a, #footer a:active defines the link color property for the Footer Text. Here you can change the hex color code to change the link color. Click Here to Pick Color Codes .

a) Replacing:

If  your footer code already have the code below, simply replace content in orange to to your desired link color.

color: #026e75;

For example if I want the footer link color to black (#000000), the code will look like this:

#footer a, #footer a:active {
color: #000000; /*Change footer link color here*/
text-decoration: underline;
}

 

a) Adding:

If  your footer code do not have the codes below, simply copy and paste the code below between the { }. Then change “#026e75” to the color code you want you want.

color: #026e75;

For example if I want the footer link color to black (#000000), the code will look like this:

#footer a, #footer a:active {
color: #000000;
}

 

3) Save & Publish

 

Tags: