HowHindi Knowledge and Help Tutorial Hindi

  • Blog
    • Computer tricks
    • Free recharge
  • How To
  • Android Tricks
  • Internet
    • Make Money Online
    • Paytm
  • Social Media
    • WhatsApps
    • Facebook
  • Blogging
    • WordPress
    • Adsense
    • Web Hosting
    • Youtube
You are here: Home / Blogging / Blogger Stylish Lables Kaise Add Kare How Add Stylish Lables in Blogger

Blogger Stylish Lables Kaise Add Kare How Add Stylish Lables in Blogger

लेखक: Aman Kumawatश्रेणी: Blogging, How Toपढ़ने का समय: 11 मिनट

Blogger stylish lables

Blogger Stylish Lables Kaise Jodte Hai Blogger में Stylish label Add करना बहुत आसान है blog website को अच्छा look देने के लिए एक एक चीज से look बदल सकते हैं इसलिए Stylish label category लगाते हैं Blog website में हमने देखा है कि कई तरह के Stylish lable category लगाते हुए दिखाई देते हैं जो हमें अच्छा और professional लुक देता है और visitor को भी अच्छे लगते हैं

वैसे Blogger blog पर already label category widget आता है लेकिन वह simple होता है जिसे अच्छा नहीं लगता है और visitors को भी बिल्कुल पसंद नहीं आता है और उस पर click भी नहीं करते है जो जिस category में जाना चाहते हैं so दोस्तों हमें Blogger blog में Stylish style label category change कर सकते हैं

Simple category label को बदल सकते हैं और New label category लगा सकते हैं

Label/category क्या होता है

Labels category वह होता है जो हम पोस्ट ready करते हैं उन post को अलग अलग category श्रेणी में डाल देते हैं जिसे visitors को उस post को आसानी से ढूंढ सकते हैं या जिस तरह के post को पढ़ना चाहते हैं वो पढ़ सकते हैं

जैसे love shayari के बारे में पढ़ना चाहते हैं तो love shayari category click करके love shayari post किए हुए है उनको पढ सकते है, इसलिए हमारे ब्लॉक के लिए Blogger labels widget Add करना होता है

Label widget Blogger me kaise Add kare

Label widget Blogger में कैसे सेट करते हैं इसके बारे में जानकारी नीचे देने जा रहा हूं. Blogger Me label widget Add करने के लिए नीचे दिए गए स्टेप्स को फॉलो करें

  1. First of all Blogger.com dashboard में जाए
  2. Theme(template) click kareblogger edithtml
  3. Edit HTML पर क्लिक करें
  4. Control + F दबा कर ]]></b:skin> को सर्च करें ]]></b:skin> यह कोड आपको चार-पांच जगह मिल सकती है)Edit Html lables
  5. ]]></b:skin> कोड मिल जाने पर नीचे दिए गए कोड को इसके ]]></b:skin> के ऊपर पेस्ट कर देंlables html code

[Style 1]

Blogger Labels Stylish widget style 1

Stylish Lable blogger

[button color="" size="" type="square_outlined" target="" link=""]

.Label a {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
background-color: #7FBF4D;
background-image: -moz-linear-gradient(center top , #7FBF4D, #63A62F);
border-bottom-right-radius: 30px;
border-color: #63A62F #63A62F #5B992B;
border-image: none;
border-style: solid;
border-top-left-radius: 30px;
border-width: 1px;
box-shadow: 0px 1px 0px 0px #96CA6D inset;
color: #FFFFFF;
float: left;
font: 14px verdana;
height: 18px;
margin-bottom: 9px;
margin-left: 10px;
padding: 10px;
position: relative;
text-decoration: none;
transition: all 0.5s ease-in-out 0s;
}

.Label a:hover {
background: none repeat scroll 0% 0% orange;
border-radius: 0px 30px 0px 30px;
border: 1px solid orange;
text-shadow: 5px 5px 5px #DCDCDC;
}

.Label {
margin: 0px;
padding: 0px;
position: relative;
}
.Label li:hover {
transform: rotate(5deg);
}
.Label li {
float: left;
font-size: 116%;
list-style: none outside none;
transition: all 0.3s ease 0s;
}

[/button]

6. Last में save theme (template) क्लिक करके save कर दे

इस प्रकार आपके Blogger में Stylish labels Add करके New लुक दे सकते है और visitors को improve कर सकते है, ऐसे ही अलग अलग Labels Stylish बताने जा रहा हूँ जिसमे आप अपने मन पसंद के Blogger में different style Labels Add कर सकते है

Blogger Labels Widget  Style 2

Blogger lables style

[button color="" size="" type="square_outlined" target="" link=""]

www.Howhindi.com */

.label-size {display:inline-block; float:left; pAdding:7px; font:12px verdana; text-transform:uppercase; margin:0 4px 4px 0;}

.label-size a {color:#fff!important; text-shadow:0 1px 0 rgba(0, 0, 0, 0.5);}

.label-size a:hover {text-decoration:none;}

.label-size:nth-child(1) {background:#ff0000;}

.label-size:nth-child(2) {background:#cf650d;}

.label-size:nth-child(3) {background:#9e0963;}

.label-size:nth-child(4) {background:#f54e67;}

.label-size:nth-child(5) {background:#42ad9d;}

.label-size:nth-child(6) {background:#b3001b;}

.label-size:nth-child(7) {background:#5c3e31;}

.label-size:nth-child(8) {background:#8e4811;}

.label-size:nth-child(9) {background:#ff9900;}

.label-size:nth-child(10) {background:#097054;}

.label-size:nth-child(11) {background:#6599ff;}

.label-size:nth-child(12) {background:#461d7c;}

.label-size:nth-child(13) {background:#666666;}

.label-size:nth-child(14) {background:#00ff00;}

.label-size:nth-child(15) {background:#7c71ad;}

.label-size:nth-child(16) {background:#1eb6ff;}

.label-size:nth-child(17) {background:#898c17;}

.label-size:nth-child(18) {background:#000078;}

.label-size:nth-child(19) {background:#ffcc00;}

.label-size:nth-child(20) {background:#cc3333;}

.label-size:hover {opacity:0.6; -webkit-transition:0.5s; -moz-transition:0.5s; transition:0.5s;}

[/button]

[Style 3]

Blogger Stylish Labels Add Blogger Stylish Labels Lgaye

blogger lables style3

[button color="" size="" type="square_outlined" target="" link=""]/* cloud label by www.Howhindi.com */

.label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5 {

font-size:100%;

filter:alpha(100);

opacity:10

}

.cloud-label-widget-content{

text-align:left

}

.label-size {

border-radius:30px;

background:#FA0830;

display:block;

float:left;

margin:0 3px 3px 0;

color:#ffffff;

font-size:11px;

text-transform:uppercase;

}

.label-size a,.label-size span{

display:inline-block;

color:#ffffff !important;

pAdding:6px 8px;

font-weight:bold;

}

.label-size:hover {

border-radius:30px;

background:#333333;

}

.label-count {

white-space:nowrap;

border-radius:30px;

pAdding-right:3px;

margin-left:-3px;

background:#333333;

color:#fff !important;

}

.label-size {

line-height:1.2

}[/button]

[Style-4]

Blogger Labels Style Lgaye

Blogger lables

[button color="" size="" type="square_outlined" target="" link=""]

/*-----Custom Labels Cloud widget by www.Howhindi.com----*/
.label-size{
margin:0 2px 6px 0;
pAdding: 3px;
text-transform: uppercase;
border: solid 1px #C6C6C6;
border-radius: 3px;
float:left;
text-decoration:none;
font-size:10px;
color:#666;
}

.label-size:hover {
border:1px solid #6BB5FF;
text-decoration: none;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
-moz-transform: rotate(7deg);
-o-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
-ms-transform: rotate(7deg);
transform: rotate(7deg);
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand');
zoom: 1;
}

.label-size a {
text-transform: uppercase;
float:left;
text-decoration: none;
}
.label-size a:hover {
text-decoration: none;
}

[/button]

यह भी पढ़े-

  1. Feedburner feed Blogger में कैसे ADD करें Traffic ke liye
  2. Blogger navbar kaise hataye easy step
  3. Facebook popup like box Blogger में कैसे Add करें

इस प्रकार अपने Blogger में Stylish Labels Add कैसे करते है पोस्ट को पढ़कर आप समझ गये होगे की कैसे website किस प्रकार अच्छा लुक देता है, Stylish Labels कैसे लगाते है, और colourfull Labels या desgin Labels kyu Add karte hai, Blogger में Stylish Labels Add करने में कोई Problem आती है तो comment करके सवाल पूछे, और हमारा फेसबुक page like करना नही भूले धन्यवाद|

टैग: Blogging How To

शेयर
  • Facebook
  • Twitter
  • Pin It
  • Email
  • LinkedIn
  • WhatsApp

आपको ये पढना चाहिए

  • Train देखने वाला Apps Download करें [रेल Check Status in हिंदी]

    Train देखने वाला Apps Download करें [रेल Check Status in हिंदी]

  • 1 Billion कितना होता हैं (एक बिलियन बराबर कितने होते हैं)

    1 Billion कितना होता हैं (एक बिलियन बराबर कितने होते हैं)

  • Simple Present indefinite Tense Hindi To English Translation

    Simple Present indefinite Tense Hindi To English Translation

About the Author

I'm the Founder of Howhindi.com. We provide daily information about Android mobile, computer, internet, Earn money, Loan in Hindi.

Reader Interactions

टिप्पणियाँ ( 0 )

टिप्पणियाँ देखें

अपनी प्रतिक्रिया दें। Cancel reply

Primary Sidebar

यह भी पढ़ें

  • 1 Hectare में कितना बीघा होता हैं?
  • Photo पर Song कैसे लगायें (App Download करें)
  • Vodafone का Number कैसे निकाले {Check करें}
  • OTP क्या होता हैं (उपयोग और फायदे Details in Hindi)
  • PUBG Stylish Name Generator With Symbol Ideas (Copy/Paste)
  • 1 मीटर में कितने फुट होते हैं (Meter To Feet Conversion)

TOPICWISE

  • Adsense (6)
  • Airtel (18)
  • Android Tricks (63)
  • Apps (128)
  • Bank (10)
  • Blogging (30)
  • Computer tricks (23)
  • Domain (5)
  • Earn Money (15)
  • Education Apps (2)
  • Email (6)
  • English Speaking (5)
  • Exams (3)
  • Facebook (11)
  • Featured (2)
  • Festival (3)
  • Free Internet (9)
  • Free recharge (12)
  • Games (3)
  • GK (8)
  • Hack (12)
  • Health (4)
  • Hindi Story (8)
  • How To (247)
  • Internet (69)
  • iPhone (1)
  • jio (21)
  • Make Money Online (20)
  • Maths (1)
  • Mobile (3)
  • Paytm (17)
  • Seo (13)
  • Shayari (3)
  • Social Media (32)
  • Spicy FOOD (7)
  • Stylish Text Generator (4)
  • Tech News Hindi (154)
  • Tenses (3)
  • Trick (44)
  • Web Hosting (3)
  • WhatsApps (17)
  • Wordpress (20)
  • Youtube (9)

Explore us!

How to Blogging Blogging
Security Tips Mobile App
Android Tricks Android
Educational Educational
Paisa Kaise Kamayen? Earn Money
Hindi Wikipedia Computer
Definations Meanings Internet
Social Networking Social-Sites
Technology Technology
Technology How to

Footer

हाउहिंदी.कॉम के बारे में

I'm the Founder of Howhindi.com. We provide daily information about Android mobile, computer, internet, earn money, Loan in Hindi. Read More

SUBSCRIBE FOR MORE UPDATE

हमारी नवीनतम पोस्ट की सुचना ईमेल के द्वारा पाने के लिए अभी हमारे ब्लॉग को सब्सक्राइब करे, ये सर्विस बिल्कुल फ्री है।

GET ME ON SOCIAL


कॉपीराइट © 2015–2021 DMCA.com Protection Status हमारे बारे मेंसम्पर्क करेंप्राइवेसीसाइटमैपब्लॉगटॉप