How To Add Night Mode Or Dark Mode

How To Add Night Mode Or Dark Mode
Saturday, 27 June 2020

How To Add Dark And Night Mode In Blogger Blog Website Hindi

How to Add Night Mode or Dark Mode in Blogger Blog Template Easill

Hello Dosto Kya Haal Chaal He Umid He Sab Thick Honge To Dosto Aaj Me Aap Ke Liye Bahut Hi Achha Trick Yaani Blogger Website Ke Liye Widgets Le Kar Aya Hu Ye Widgets Mene Kaafi Logo Ke Blog Website Par Dekha Iss Widget Ka Kaam Andhera Lana Hota He Yaani Aap Ke Website Ko Bilkul Kala Kar Dega Jisse Ham Dark Mode Ya Night Mode Kahte He Or Jo Bhi Hamare Website Par Ayega To Usse Article Read Karne Me Koi Pareshani Nhi Hogi, Yaani Agar Night Me Koi Visitor Aata He Aap Ke Website Par To Wo Use Dark Mode Night Mode Ko Chaalu Kar Sakta He, Iss Coding Ke Jariye Aap Ka Website Bhi Premium Jaisa Dikhai Deta He Visitor Sochta He Iske Website Par Pahut Hi Achha Article He Matalab Design Bahut Achha Kar Ke Rakhna Padata He Agar Aap Ke Paas Abhi Achha Design Wala Template Nhi He Or Aap Ke Paas Premium Template Bhi Nhi He To Me Aaj Aap Ko Bahut Hi Achha Template Deta Hu Mere Iss Template Ka Design Bhi Achha He Or Sabhi Feature Add Kyaa Gayaa He Magar Ye Paise Me He Dosto Free Nhi He Iske Liye Sorry Poori Details Ke Liye Click Kare

Blue Wave Blogger Template

Mene Free Wale Bhi Template Ke Baare Me Bataya He Jisme Feature Achhe Milte He To Dosto Ham Kaha The Sayad Aap Bhool Gaye Honge Chalo Ham Hi Bataa Dete He Me Iss Article Me Aap Ko Bataunga Kaise Add Karate He Dark Mode Night Mode Widget Or Dosto Agar Aap Ko Blogger Template Customize Karne Nhi Aata He To Ye Article Dekh Sakte He How To Customize Blogger Template Agar Sahi Se Aap Ko Blogger Template Bhi Upload Ya Restore Nhi Karne Aata He To Ye Bhi Article Dekh Sakte He How To Upload Blogger Template Ye Sab Aap Ke Liye He Chaliye Mene To Aap Ko Template Ke Baare Me Bata Diya Aab Baari He

How To Add Dark Mode In Blogger Template

Ki Wese Dosto English Me Likhna Padta He Thora Saa Aisa Nhi Karenge To Public Ke Paas Hamara Article Nhi Pahuch Payega To

Kaise Add Karte He Dark Mode Night Mode Blogger Template Me

Ab Suru Karte He Step By Step Bina Time Waste Kiye To Me Bata Du Dosto

Night Mode

Add Karne Ke Liye Aap Ke Paas Thori Si Css Coding Ki Jaankari Honi Chahiye Kyu Ki Night Mode Lagane Ke Liye Aap Ko Dark Night Prabhav Kaha Kaha Dikhana He Coding Ko Istemal Kar Ke Laga Sakate He To My Dear Dosto Sabse Pahle Aap Ko Blogger Blog Website Par Jana He Mere Website Ka Name

Glitch Times

He Wese Hi Aap Ka Website Ka Name Samane Aayega Uss Website Ko Select Kar Lena He Ab Aap Ko Pahuch Jana He Apne Website Ke Main Menu Me To Dosto Issko Aap Mobile Ke Jariye Nhi Laga Sakte He

Dark Mode Night Mode Widget

Iske Liye Aap Ke Paas Ek Computer Yaa Android Application Jiska Name

Quick Edit Android App

He Iss Ke Madat Se Edit Xml Kar Sakte He Yaa To Aap mere Article Ko Dekh Ya Reading Kar Sakate He Iss Me Mene Bataya He

How To Edit Blogger Template In Android Mobile

Ummid He Aap Ko Ye Jankari Mil Gayee He Me To Computer Ya Laptop Se HTML Edit Kar Ke Bataunga Ab Aap Ko
Step 1 Theme Button Par Click Karna He Ab Aap Blogger Template Ya Theme Ke Main Menu Me Aa Gaye Ho Ab Aap Ko Customize Ke Uper 3 Dot Kuchh Iss Tarah Se Dikhai Dega Uss Par Aap Ko Click Kar Dena He. 
Step 2 Jaise Hi 3 Dot Par Click Karenge Wese Hi Aap Ke Saamne Edit HTML Ka Option Dikhaee Dega

Edit Html

Par Aap Ko Click Kar Dena He
Step 3 Wo Mere Dosto Ab Aap Ke Saamne Edit Xml Html Aa Jayega Magar Dhiyan Se Edit Karna He Thora Sa Gadabadi Me Aap Ka Poora Ka Poora

Template Theme

Kharab Ho Sakta He Iss Ke Liye Aap Ko Apne Template Ya Theme Ka Jisse Ham

Theme Backup

Kahte He Jaldi Se Usse Le Lena He Ya Download Kar Lena He
Step 4 Mere Pyare Dosto

My Dear Friends

Friendship With Me, Me Pata Nhi Kaha Nikal Gya Chalo Main Mudde Par Aate He Ab Aap Ke Samane Wo Tamam Coding Dikhak Degi Jo Dimaag Se Pare He oon Sab Code Ke Bich Me Aap Ko Akele Kahi Bhi Click Kar Dena He, Hhhhhmmm
Step 5 Itna Jaldi Step Five Par Aa Gayee Mere Ko Pata Nhi Chala Mere Friends Aap Ko Search Yani Khojana He Ek Code Jiska Name He ]]></b:skin> Aap Apne

Computer Or Laptop

Me Keyboard Ki Sahayata Se
 Ctrl+F Dabao Or Khojo 
Khoj Sakte He Iss Code Ko Khojne Ke Baad Sorry Step 6 Bhool Gayee Niche Aao Bahut Nichhe
Step 6 Aab Aap Ko Iss Code Ke 

<style type='text/css'>
/*---- Night Mode/Yaha Par Past Kariye ----*/ 
Yaha Hu Me Iske Under Daalo Aap Ka Css Code 
</Style>

Bich Me Khoj Kar Daal Dena He Yaani Copy Kar Ke Past Kar Dena He Thora Jaise Kuchh Iss Tarah Se Dikhai Dega To Aap Ko

Double Click

Karenge Box Me To Copy Ho Jayega
 

/*---- Night Mode/Dark Mode Feature ----*/ 
.modedark {
    background: linear-gradient(to right, #eb3349 40%, #f45c43); //Background color of icon
    float: left;
    position: fixed;
    bottom: 0;             //Change this for position 
    z-index: 999;
    opacity:0.7            //Opacity Degree Of Icon 
}

.modedark svg {
    width: 24px;
    height: 24px;
    vertical-align: -5px;
    background-repeat: no-repeat!important;
    content: ''
}

.modedark svg path {
    fill: #fff
}

.modedark .check:checked~.NavMenu {
    opacity: 1;
    visibility: visible;
    top: 45px;
    min-width: 200px;
    transition: all .3s ease;
    z-index: 2
}

.iconmode {
    cursor: pointer;
    display: block;
    padding: 8px;
    background-position: center;
    transition: all .5s linear
}

.iconmode:hover {
    border-radius: 100px;
    background: rgba(0, 0, 0, .2) radial-gradient(circle, transparent 2%, rgba(0, 0, 0, .2) 2%) center/15000%
}

.check {
    display: none
}

.modedark .iconmode .openmode {
    display: block
}

.modedark .iconmode .closemode {
    display: none
}

.modedark .check:checked~.iconmode .openmode {
    display: none
}

.modedark .check:checked~.iconmode .closemode {
    display: block
}

/*----- Start adding Elements From here -----*/ 
// Start with .nightmode followed by element(class or id) {their_properties} 
.nightmode{background:#15202B;color:rgba(255,255,255,.7)}
.nightmode #outer-wrapper,.nightmode #sidebar-wrapper{background:#323232;color:#fff!important}

/* ---   Add More Elements --- */

Wese Mere Pyare Dosto Ye Jo Start Adding Elements From Here He Na 

Issi Code Ko Aap Ko Edit Karna He Apne Blog Ke Hisaab Se 

Matalab Jaise Mene Header Par Dark Dikhana He To 
.nightmode #header {background:color
Apne Hisaab Se Or #Text Kaisa Dikhai De ! important 

Aise Hi Jaha Jaha Dark Color Black Color Ka Prabhav Karanaa He Aise Hi Code Ko Adjust Kar Na He Aap Ko 


mr - Step 7 Par Aap Ko Bataya Jayega Upar Wala Css Code Sahi Se Laga Liye He To Thats Great Ab Aap Ko HTML Button Add Karna He Jo Aap Css Ki Madat Se Kahi Bhi Laga Sakte He To Ye He Wo Button Jiski Madad Se Aap Apne Blog Website Par Click Kar Ke Night Mode Laga Sakte He To Ye HTML Code He Iske Baad JavaScript Milega 


Yaha HTML Code Ko Double Click Karenge To Copy Ho 

<div class='modedark'><input class='check' id='modedark' title='Mode Dark' type='checkbox'/>
<label class='iconmode' for='modedark'>
<svg class='openmode' viewBox='0 0 24 24'><path d='M12,18C11.11,18 10.26,17.8 9.5,17.45C11.56,16.5 13,14.42 13,12C13,9.58 11.56,7.5 9.5,6.55C10.26,6.2 11.11,6 12,6A6,6 0 0,1 18,12A6,6 0 0,1 12,18M20,8.69V4H15.31L12,0.69L8.69,4H4V8.69L0.69,12L4,15.31V20H8.69L12,23.31L15.31,20H20V15.31L23.31,12L20,8.69Z'/></svg>
<svg class='closemode' viewBox='0 0 24 24'><path d='M14.3,16L13.6,14H10.4L9.7,16H7.8L11,7H13L16.2,16H14.3M20,8.69V4H15.31L12,0.69L8.69,4H4V8.69L0.69,12L4,15.31V20H8.69L12,23.31L15.31,20H20V15.31L23.31,12L20,8.69M10.85,12.65H13.15L12,9L10.85,12.65Z'/></svg>
</label>
</div>


Step 8 Final Stage Ab Isaki Kahani Khatam Ho Jayegi Bye Bye Fir Milenge Ab Aap Ko JavaScript Ko  </body>  Ke Upar Daal Dena He Ya Copy Kee Huyee Code Ko </body> Ke Upar Past Kar Dena He


<script type='text/javascript'>
//<![CDATA[
/* Night Mode/Dark Mode Feature */ 

$(document).ready(function(){$("body").toggleClass(localStorage.toggled),$("#modedark").on("click",function(){"nightmode"!=localStorage.toggled?($("body").toggleClass("nightmode",!0),localStorage.toggled="nightmode",$(".section-center").css("display","block")):($("body").toggleClass("nightmode",!1),localStorage.toggled="",$(".section-center").css("display",""))}),$("body").hasClass("nightmode")?$("#modedark").prop("checked",!0):$("#modedark").prop("checked",!1)});
//]]>
</script>  
Iss Tarah Se Aap Ke Blog Website Par Add Night Mode In Blogger Template Par Dark Or Night Mode Lag Jayega I Hope Enjoy Kiye Honge Aap Agar Aap Ka Koi Bhi Bada Wala Ya Chhota Sujhaav Kuchh Puchhana Ya Samajh Nhj Aaya Ho To Comment Kar Ke Puchh Sakte He Than You All My Friends Please Support Me