Blog में specific Links का Color Change कैसे किया जाता है ? janiye in hindi - Hindi Idea

हेलो दोस्तो स्वागत है आपका हमारे ब्लॉग Hindi Idea में आज हम आपको बताएँगे कि Blog में specific Links का Color Change कैसे किया जाता है ?

Beautiful color effects वाले Links का होना क्यों जरुरी है ?
Blog में beautiful color link का होना बहुत ही जरुरी है | इस तरह के लिंक के तरफ visitors अधिक attract होते है और blog देखने में भी सुन्दर लगता है और links पर click करने के chances भी बढ़ जाते है | इससे blog या site का bounce rate decrease होता है जो SEO के लिए बहुत ही अच्छा है |
अगर आपके blog post में low quality color का link add है तो हो सकता है कि visitors उस लिंक की तरफ आकर्षित न हो और उस पर click न करें और वे आपके site को छोड़कर किसी दूसरे site पर visit कर जाये | इससे आपके site की bounce rate increase कर सकती है जो कि SEO के नजरिये से अच्छा नहीं है |
इसलिए आप अपने blog के सभी post में hyperlink को जरूर add करें और लिंक का color एकदम beautiful रखे | आगे मैं CSS code के बारे में बताने जा रहा हूँ जिसको template में add करके आप अपने blog के specific links को change कर सकते है |

Links या Hyperlink क्या है ?
हम लोग जानते है कि by default hyperlink highlighted blue color का underlined text (unvisited link) होता है | इस पर click करने के बाद new webpage open होता है |
Template में निम्न four hyperlink states के CSS codes को add करके links में चार तरह के apperance को show कर सकते है :-

Normal Links : Normal links unvisited links होता है | इस तरह के links में किसी भी तरह का छेड़छाड़ नहीं करने पर इसका appearance normal रहता है |Normal links CSS code – a:link { color: #ff0000 !important; }
Visited Links : जब visitors पहले से ही links पर click कर चुका होता है तब links का जो appearance (color) होता है, visited links कहते है |
Visited links code – a:visited { color: #0000ff !important; }
Hover Links : जब visitors mouse के cursor को links पर ले जाता है तो hover links का appearance (color) change होता है |
Hover links code – a:hover { color: #38761d !important; }
Active Links : जब visitors mouse के button को release करने से पहले directly link पर click करता है तो active links का appearance (color) change होता है |
Active links code – a:active { color: #ff9900 !important; }
इस four states के hyperlink के CSS Code को template में add करके links में beautiful appearance और effects डाल सकते है |

BlogSpot Blog में Specific Links के Color को Change करने के लिए CSS Codes :

1. All Links [ to change color of all links ]

a:link {
color: #ff0000 !important;
}
a:visited {
color: #0000ff !important;
}
a:hover {
color: #38761d !important;
}
a:active {
color: #ff9900 !important;
}

2. Post Links [ to change color of all links inside post body]

.post-body a {
color: #ff0000 !important;
}
.post-body a:visited {
color: #0000ff !important;
}
.post-body a:hover {
color: #38761d !important;
}
.post-body a:active {
color: #ff9900 !important;
}

3. Post Title [ to change post title color]

.post-title a {
color: #ff0000 !important;
}
.post-title a:visited {
color: #0000ff !important;
}
.post-title a:hover {
color: #38761d !important;
}
.post-title a:active {
color: #ff9900 !important;
}

4. Sidebar Links [ to change all links color within sidebar]

.sidebar a {
color: #ff0000 !important;
}
.sidebar a:visited {
color: #0000ff !important;
}
.sidebar a:hover {
color: #38761d !important;
}
.sidebar a:active {
color: #ff9900 !important;
}

5. Footer Links [ to change all footer links color]

.footer-outer a {
color: #ff0000 !important;
}
.footer-outer a:visited {
color: #0000ff !important;
}
.footer-outer a:hover {
color: #38761d !important;
}
.footer-oute a:active {
color: #ff9900 !important;
}

6. Label Links [ to change label links ]

.post-labels a {
color: #ff0000 !important;
}
.post-labels a:visited {
color: #0000ff !important;
}
.post-labels a:hover {
color: #38761d !important;
}
.post-labels a:active {
color: #ff9900 !important;
}

7. Archive Gadget Links

#ArchiveList a {
color: #ff0000 !important;
}
#ArchiveList a:visited {
color: #0000ff !important;
}
#ArchiveList a:hover {
color: #38761d !important;
}
#ArchiveList a:active {
color: #ff9900 !important;
}

8. Comment Link

.comment-link {
color: #ff0000 !important;
}
.comment-link : visited {
color: #0000ff !important;
}
.comment-link : hover {
color: #38761d !important;
}
.comment-link : active {
color: #ff9900 !important;
}

Notes :-

CSS code में color code #ff0000, #0000ff, #38761d, #ff9900 के place पर आप अपने पसंद के color code का इस्तेमाल कर सकते है |
Various types के color code को w3schools या 2createwebsite site पर जाकर प्राप्त कर सकते है |

Blogger Template में CSS codes को कैसे Add करें ?
CSS codes को template में add करने के लिए निम्न steps को follow करे :

Step 1
सबसे पहले blogger.com पर जाकर अपने blogger account में login करें |

Step 2
अब blogger dashboard open होगा |
Theme पर click करे |
Customise पर click करे |

Step 3

Advanced पर click करे |
Add CSS पर click करे |
Blog में जिस भी links के color को change करना है चाहे वह post links, footer links etc. हो, उसके CSS code को ऊपर से copy करके CSS box में paste कर दें |