બ્લોગર પર પૃષ્ઠ નેવિગેશન વિજેટ કેવી રીતે ઉમેરવું

બ્લોગર પર પૃષ્ઠ નેવિગેશન વિજેટ કેવી રીતે ઉમેરવું? બ્લોગ બનાવ્યા પછી, દરેક બ્લોગરે પોતાનો બ્લોગ ડિઝાઇન કરવો પડશે. અને બ્લોગ ડિઝાઇનમાં, તમારે બ્લોગર બ્લોગ પર ઘણા વિજેટ્સ ઉમેરવા અને દૂર કરવા પડશે. તેથી આજે અમે આવા વિજેટ વિશે શીખીશું, જે તમારે તમારા બ્લોગ પર ઉમેરવા પડશે. અને તે વિજેટ પેજ નેવિગેશન વિજેટ છે.

અને આ ખૂબ જ મહત્વપૂર્ણ છે, કારણ કે જો તમારી પાસે તમારા બ્લોગ પર 5,7 થી વધુ પોસ્ટ્સ છે, તો તમારે હોમ પેજ પરની બધી પોસ્ટ્સ બતાવવી જોઈએ નહીં, અને પૃષ્ઠ નેવિગેશન વિજેટનો ઉપયોગ કરવો જોઈએ નહીં. તે બ્લોગની લોડ કરવાની ગતિને બગાડે નહીં.

આ પોસ્ટમાં, હું તમને બ્લોગર પર પૃષ્ઠ નેવિગેશન વિજેટ કેવી રીતે ઉમેરવું તે વિશે જણાવીશ. જેની મદદથી તમે તેને સરળતાથી તમારા બ્લોગમાં ઉમેરી શકો છો.

પરંતુ પહેલા તમારા માટે તે જાણવું ખૂબ જ મહત્વપૂર્ણ છે કે નેવિગેશન વિજેટ શું છે, અને જો તમે તેને બ્લોગ પર ઉમેરશો તો શું થશે.

તેથી જ હું પહેલા નેવિગેશન વિજેટ વિશે કહું છું, પછી અમે તેને બ્લોગમાં ઉમેરવા વિશે જાણીશું.

પૃષ્ઠ નેવિગેશન વિજેટ શું છે

પેજ નેવિગેશન એ બ્લોગ હોમ પેજની પોસ્ટની નીચે બતાવેલ છે. આ પર 1, 2,3 4,5 10 સુધી છે. અને તે તમારી જૂની પોસ્ટ્સ જોવા માટે વપરાય છે.

ધારો કે તમે અત્યાર સુધીમાં 20 પોસ્ટ્સ લખી છે, અને તમારા હોમ પેજ પર તમારી પાસે ફક્ત 5 પોસ્ટ્સ છે. તેથી આવી સ્થિતિમાં, પૃષ્ઠ નેવિગેશન વિજેટ મુલાકાતીઓને તમારી જૂની પોસ્ટ પર જવા માટે મદદ કરે છે.

પેજ નેવિગેશન પર, તમારે ઓલ્ડ, ન્યુ અથવા ન્યુમેરિક વિકલ્પ પસંદ કરવો પડશે. જેમાં નંબર સૌથી વધુ નફાકારક છે, કારણ કે ઓલ્ડ, ન્યૂ નેવિગેશન પર મુલાકાતીઓ વધુ ક્લિક કરતા નથી.

અને સંખ્યાત્મક નેવિગેશન 1,2,3,4,5… .10 શોમાં. જે મુલાકાતીઓને આકર્ષિત કરે છે, અને ક્લિક પણ કરે છે. જે બ્લોગના બાઉન્સ રેટને પણ ઘટાડે છે.

બ્લોગર પર પૃષ્ઠ નેવિગેશન વિજેટ કેવી રીતે ઉમેરવું

પૃષ્ઠ નેવિગેશન વિજેટ ઉમેરવા માટે, તમારે 2 વસ્તુઓ ઉમેરવી પડશે.

(1) સીએસએસ કોડ

(2) ટેમ્પલેટ HTML સ્ક્રિપ્ટ

પ્રથમ હું તમને સીએસએસ કોડ કેવી રીતે ઉમેરવું તે કહીશ. તો પછી તમે જાણશો કે HTML સ્ક્રિપ્ટ કેવી રીતે ઉમેરવી.

બ્લોગ પર સીએસએસ કોડ ઉમેરવા માટે, તમે તેમને> કસ્ટમાઇઝ> એડવાન્સ> સીએસએસ ઉમેરો પર જાઓ. અને નીચે આ કોડનો કોડ પેસ્ટ કરો. અને ત્યારબાદ અપ્લાય ટૂ બ્લોગ પર ક્લિક કરો.

નોંધ: નીચે હું 5 સ્ટાઇલિશ પૃષ્ઠ સંશોધકનો સીએસએસ કોડ શેર કરી રહ્યો છું. તમે કોઈપણ એક કોડની ક copyપિ કરો અને તેને તમારા બ્લોગમાં ઉમેરો.

પ્રકાર 1

# બ્લોગ-પેજર – સ્પષ્ટ: બંને; ગાળો: 30 પીએક્સ autoટો; ટેક્સ્ટ-સંરેખિત કરો: કેન્દ્ર; ગાદી: 7 પીએક્સ; b બ્લ -ગ
-પેજર {બેકગ્રાઉન્ડ: કંઈ નહીં;
is .ડિસ્પ્લેજપેનમ એ, .શowફેજ એ, .પેજકોર્નર {પેડિંગ: 5 પીએક્સ 10 પીએક્સ; માર્જિન-રાઇટ: 5 પીએક્સ; રંગ: # F4F4F4; બેકગ્રાઉન્ડ-રંગ: # 404042; -વેબકીટ-બ -ક્સ-શેડો: 0 પીએક્સ 5 પીએક્સ 3 પીએક્સ -1 પીએક્સ આરજીબીએ (50, 50, 50, 0.53); – મોઝ-બ -ક્સ-શેડો: 0 પીએક્સ 5 પીએક્સ 3 પીએક્સ -1 પીએક્સ આરજીબીએ (50, 50, 50, 0.53); બ -ક્સ-શેડો: 0 પીએક્સ 5 પીએક્સ 3 પીએક્સ -1 પીએક્સએક્સ આરજીબીએ (50, 50, 50, 0.53);
page .ડિસ્પ્લેજ નમ એ: હોવર, .શોપોજ એ: હોવર, .પેજકોર્નર {બેકગ્રાઉન્ડ: # EC8D04; ટેક્સ્ટ-ડેકોરેશન: કંઈ નહીં; રંગ:
# એફએફએફ ; blog # બ્લોગ-પેજર. શpageફેજ, # બ્લોગ-પેજર, .પેજકોર્નન્ટ {ફોન્ટ-વેઈટ: બોલ્ડ; રંગ: # 000;
ow શો પેજ fફ {ડિસ્પ્લે: કંઈ નહીં! અગત્યનું}
# બ્લોગ-પેજર. પૃષ્ઠો {સરહદ: કંઈ નહીં; -વેબકીટ-બ -ક્સ-શેડો: 0 પીએક્સ 5 પીએક્સ 3 પીએક્સ -1 પીએક્સ આરજીબીએ (50, 50, 50, 0.53); – મોઝ-બ -ક્સ-શેડો: 0 પીએક્સ 5 પીએક્સ 3 પીએક્સ -1 પીએક્સ આરજીબીએ (50, 50, 50, 0.53); બ -ક્સ-શેડો: 0 પીએક્સ 5 પીએક્સ 3 પીએક્સ -1 પીએક્સ આરજીબીએ (50, 50, 50, 0.53);}

પ્રકાર 2

# બ્લોગ-પેજર – સ્પષ્ટ: બંને; ગાળો: 30 પીએક્સ autoટો; ગાદી: 7 પીએક્સ; ટેક્સ્ટ-સંરેખિત કરો: કેન્દ્ર; ફોન્ટ-કદ: 11px; બેકગ્રાઉન્ડ-છબી: -વેબકીટ-ગ્રેડિયેન્ટ (રેખીય, ડાબી બાજુ, ડાબી બાજુ, રંગ-સ્ટોપ (0, # 000000), રંગ-સ્ટોપ (1, # 292929)); બેકગ્રાઉન્ડ-છબી: -ઓ-રેખીય-gradાળ (ટોચ, # 000000 0%, # 292929 100%); પૃષ્ઠભૂમિ-છબી: -મોઝ-રેખીય-gradાળ (ટોચ, # 000000 0%, # 292929 100%); પૃષ્ઠભૂમિ- છબી: -વેબકીટ-રેખીય-arાળ (ટોચ, # 000000 0%, # 292929 100%); બેકગ્રાઉન્ડ-છબી: -ms-linear-ientાળ (ટોચ, # 000000 0%, # 292929 100%); પૃષ્ઠભૂમિ-છબી: રેખીય-gradાળ (ટોચ પર, # 000000 0%, # 292929 100%); પેડિંગ: 6px; -વેબકીટ-બોર્ડર-ત્રિજ્યા: 3px; -મોઝ-બોર્ડર-ત્રિજ્યા: 3px; બોર્ડર-ત્રિજ્યા: 3px; bબ્લોગ
-પેજર {બેકગ્રાઉન્ડ: કંઈ નહીં;
d .ડિસ્પ્લેપઅનમ., શોપેજ એ, .પેજકોર્ન { ગાદી: 3 પીએક્સ 10 પીએક્સ; માર્જિન-રાઇટ: 5 પીએક્સ; રંગ: # fff;
.ડિસ્પ્લેપેજ નમ a: હોવર, .શોપોજ એ: હોવર, .પેજકોર્નર {બેકગ્રાઉન્ડ-ઇમેજ: -વેબકીટ-ગ્રેડિયન્ટ (રેખીય, ડાબી બાજુ, ડાબી બાજુ, કલર સ્ટોપ (0, # 59A2CF), કલર સ્ટોપ (1, # D9EAFF )); બેકગ્રાઉન્ડ-છબી: -ઓ-રેખીય-arાળ (ટોચ, # 59A2CF 0%, # D9EAFF 100%); પૃષ્ઠભૂમિ-છબી: -મોઝ-રેખીય-gradાળ (ટોચ, # 59A2CF 0%, # D9EAFF 100%) ; બેકગ્રાઉન્ડ-ઇમેજ: -વેબકીટ-રેખીય-gradાળ (ટોચ, # 59A2CF 0%, # D9EAFF 100%); પૃષ્ઠભૂમિ-છબી: -ms- રેખીય-gradાળ (ટોચ, # 59A2CF 0%, # D9EAFF 100%) -ઇમેજ: રેખીય-gradાળ (ટોચ પર, # 59A2CF 0%, # D9EAFF 100%); ટેક્સ્ટ-ડેકોરેશન: કંઈ નહીં; રંગ: # 000; -વેબકીટ-બોર્ડર-ત્રિજ્યા: 3px; -મોઝ-બોર્ડર-ત્રિજ્યા: 3px; સરહદ ત્રિજ્યા: 3
પીએક્સ ; ow શો પેજ Oફ {ડિસ્પ્લે: કંઈ નહીં! મહત્વપૂર્ણ b .બ્લોગ-પેજર-જૂની-લિંક,. હોમ-લિંક, .બ્લોગ-પેજર-નવી-લિંક {પૃષ્ઠભૂમિ: પારદર્શક;.
a.blog-પેજર- જૂની-લિંક, એ. હોમ-લિન્ક, એ.બ્લોગ-પેજર-નવી-લિંક {રંગ: # એફએફએફ;
# બ્લોગ-પેજર. પૃષ્ઠો {સરહદ: કંઈ નહીં; પૃષ્ઠભૂમિ: કંઈ નહીં;

પ્રકાર 3

# બ્લોગ-પેજર – સ્પષ્ટ: બંને; ગાળો: 30 પીએક્સ autoટો; ટેક્સ્ટ-સંરેખિત કરો: કેન્દ્ર; ગાદી: 7 પીએક્સ; }
.બ્લોગ-પેજર {પૃષ્ઠભૂમિ: none;}
.displaypageNum એક એક .pagecurrent {ફોન્ટ માપ .showpage: 12px; પેડિંગ: 5px 12px; માર્જીન-જમણે: 5px; રંગ: # 222; પૃષ્ઠભૂમિ રંગ: #ee; બોર્ડર: 1 પીએક્સ સોલિડ #EEEEEE;
d .ડિસ્પ્લેપ પૃષ્ઠ નંબર: હોવર, .શોપોજ એ: હોવર, .પેજકોર્નર {બેકગ્રાઉન્ડ: # E5E5E5; ટેક્સ્ટ-ડેકોરેશન: કંઇ નહીં; રંગ: # 222;
blog # બ્લોગ-પેજર : બોલ્ડ; રંગ: # એફએફએફ; પૃષ્ઠભૂમિ: # ડીબી 4920;
ow શો પેજ Oફ {ડિસ્પ્લે: કંઈ નહીં! મહત્વપૂર્ણ}
# બ્લોગ-પેજર. પૃષ્ઠો {સરહદ: કંઈ નહીં;

 

શૈલી 4

# બ્લોગ-પેજર – સ્પષ્ટ: બંને; ગાળો: 30 પીએક્સ autoટો; ટેક્સ્ટ-સંરેખિત કરો: કેન્દ્ર; પેડિંગ: 7 પીએક્સ; -બ્લ -ગ
-પેજર {બેકગ્રાઉન્ડ: કંઈ નહીં;
d .ડિસ્લેપેજ નમ એ, .શowપેજ એ, .પેજકોર્નર {પેડિંગ: 3 પીએક્સ 7 પીએક્સ; માર્જિન-રાઇટ: 5 પીએક્સ; બેકગ્રાઉન્ડ: # E9E9E9; રંગ: # 888; સરહદ: 1px સોલિડ # E9E9E9;
d .ડિસ્પ્લેપ પૃષ્ઠ નંબરો: હોવર, .શોપોજ એ: હોવર, .પેજકોર્નર {બેકગ્રાઉન્ડ: #CECECE; ટેક્સ્ટ-ડેકોરેશન: કંઈ નહીં; રંગ: # 000;}
શોપઓફઓફ {ડિસ્પ્લે: કંઈ નહીં! મહત્વપૂર્ણ
blog # બ્લોગ-પેજર .શાવપેજ, # બ્લોગ-પેજર. પૃષ્ઠ વર્તમાન {ફોન્ટ-વજન: બોલ્ડ; રંગ: # 888;
blog # બ્લોગ-પેજર. પૃષ્ઠો {સરહદ: કંઈ નહીં;

પ્રકાર 5

# બ્લોગ-પેજર – સ્પષ્ટ: બંને; ગાળો: 30 પીએક્સ autoટો; ટેક્સ્ટ-સંરેખિત કરો: કેન્દ્ર; પેડિંગ: 7 પીએક્સ; b બ્લ -ગ
-પેજર {બેકગ્રાઉન્ડ: કંઈ નહીં;
d .ડિસ્પ્લેજપેનમ એ., શowફેજ એ, .પેજકોર્નર {ફોન્ટ-સાઇઝ: 14 પીએક્સ; પેડિંગ: 5 પીએક્સ 12 પીએક્સ; માર્જિન-રાઇટ: 5 પીએક્સ; રંગ: # 666; બેકગ્રાઉન્ડ-રંગ: # આઇઇ;
isડિસ્પ્લેપ પૃષ્ઠ ગણતરી: હોવર, .શોપપેજ એ: હોવર, .પેજકોર્નર {બેકગ્રાઉન્ડ: # 359 બીઇડી; ટેક્સ્ટ-ડેકોરેશન: કંઈ નહીં; રંગ:
# એફએફએફ ;} # બ્લોગ-પેજર .પેજ વર્તમાન {ફોન્ટ-વેઇટ : બોલ્ડ; રંગ: # એફએફએફ; પૃષ્ઠભૂમિ: # 359 બીઇડી;
ow શો પેજ fફ {ડિસ્પ્લે: કંઈ નહીં! મહત્વપૂર્ણ}
# બ્લોગ-પેજર. પૃષ્ઠો {સરહદ: કંઈ નહીં;

હવે  આ  કોડમાંથી કોઈ એક પેસ્ટ કર્યા પછી   , તમારે થીમ પર સ્ક્રિપ્ટ ઉમેરવી પડશે   , આ માટે તમે થીમ> એડિટ એચટીએમએલ પર ક્લિક કરો, પછી ટેમ્પલેટ ખુલ્યા પછી, ક્લ્ટ + એફ  બટન પર ક્લિક  કરો અને શોધ બાર  ]]> </ b: ત્વચા>  શોધો અને તેની ટોચ પર આ કોડ પેસ્ટ કરો.

<બી: જો કોનડ = ‘ડેટા: બ્લોગ.પેજટાઇપ! = & quot; આઇટમ & quot;’>
<બી: જો કોનડ = ‘ડેટા: બ્લોગ.પેજટાઇપ! = & quot; સ્થિર_પેજ & quot;’>
<સ્ક્રિપ્ટ પ્રકાર = ‘લખાણ / જાવાસ્ક્રિપ્ટ’>
/ * <! [
સીડીએટીએ [* / વાર દીઠ પેજ = 7;
var numPages = 6;
var firstText = ‘પ્રથમ’;
var lastText = ‘છેલ્લું’;
var prevText = ‘«ગત’;
var nextText = ‘આગળ »’;
var urlactivepage = location.href;
var હોમપેજ = “/”;
/ *]]> * /
</script>
<સ્ક્રિપ્ટ src = “https://myhindinotes.com/tools/WidgetCodes/page-navication.js” />
</ b: જો>
</ b: if>

અને છેલ્લા નમૂનામાં સેવ ટેમ્પલેટનાં બટન પર.

Leave a Comment