خطوات اضافة متغير تأثير الألوان التلقائي في قالب Plus UI
تأثير الألوان التلقائي في قالب Plus UI |
هذه الإضافة ثم تطويرها بواسطة مصممي قالب Plus UI لتجعل من موقعك يظهر بشكل جذاب وتعطي لمسة جميلة للمستخدمين وللزوار الموقع وتجذبهم للعودة وتصفح أكبر وقت ممكن داخل الموقع.
طريقة إضافة متغير الألوان داخل قالب Plus UI
يمكن استخدام "Auto Themer" كوسيلة مبتكرة لإضفاء جو مميز على موقعك، حيث يقوم بتغيير سمة الموقع كل 5 ثوانٍ، مما يمنح تجربة مستخدم فريدة تشبه الأجواء الديسكو. إليك بعض الأفكار حول كيفية استخدام هذه الميزة.
كيفية استخدام متغير الألوان "Auto Themer"
- جذب الانتباه: إذا كان لديك محتوى معين ترغب في تسليط الضوء عليه، يمكنك تشغيل Auto Themer لبضع دقائق لجذب الزوار وجعلهم يتفاعلون مع الموقع.
- التفاعل مع الزوار: يمكن دعوة الزوار لتجربة Auto Themer والمشاركة بآرائهم حول الألوان والتصميمات المختلفة، مما يزيد من التفاعل على موقعك.
- التحديثات المستمرة: إذا زاد عدد المستخدمين بشكل ملحوظ، سيتم العمل على تحسين الكود وتقديم تحديثات بشكل دوري.
- تحسين واجهة المستخدم: ستركز الترقيات المستقبلية على تحسين تجربة المستخدم في واجهة المستخدم Plus UI، مما قد يتطلب جمع ملاحظات من المستخدمين الحاليين.
اليك الآن الخطوات لإضافة هته الميزة الرائعة :
- انتقل إلى لوحة تحكم Blogger.
- انقر فوق زر السمة، ثم انقر فوق تحرير HTML.
- عبر زر Ctrl+F ابحث عن وسم ]]></b:skin>
- بعد إيجاد الوسم قم بنسخ كود CSS التالي وألصقه فوقه مباشرة
CSS/* --- autoThemeChanger --- */.head1,.para1,.para2{margin-left:6px}.head1{font-size:14px;color:#343435;margin-bottom:-7px;font-weight:unset}.para1{margin-bottom:-11px}.brr{content:"";display:block;border-bottom:1px solid var(--contentL);margin:12px 5px}.brr-marginfix{margin-top:-6px}.cusP{margin-bottom:-20px}@media screen and (min-width:750px){.switch{left:205px;top:-48px}.Rtl .switch{left:-205px}}@media screen and (max-width:361px) and (min-width:322px){.switch{left:220px;top:-45px}.Rtl .switch{left:-220px}}@media screen and (max-width:321px){.switch{left:202px;top:-46px}.Rtl .switch{left:-202px}}@media screen and (max-width:376px) and (min-width:362px){.switch{left:240px;top:-45px}.Rtl .switch{left:-240px}}@media screen and (max-width:415px) and (min-width:395px){.switch{left:280px;top:-45px}.Rtl .switch{left:-280px}}@media screen and (max-width:394px) and (min-width:377px){.switch{left:255px;top:-45px}.Rtl .switch{left:-255px}}@media screen and (max-width:749px) and (min-width:416px){.switch{left:286px;top:-45px}.Rtl .switch{left:-286px}}.switch{position:relative;display:inline-block;width:55px;height:30px;margin-bottom:-2000px;left: 210px; transform: rotate(90deg);}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:"";height:22px;width:22px;left:3.5px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:var(--linkC)}.drK input:checked+.slider{background-color:var(--darkU)}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{-webkit-transform:translateX(26px);-ms-transform:translateX(26px);transform:translateX(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}
إضافة كود HTML متغير الألوان "Auto Themer"
- بنفس الخطوات السابقة نبحث عن هذا الكود <div class='cusP'>
- بعد العثور على الكود المطلوب ، قم بتغييره بهذا الكود الجديد
HTML<div class='cusP'> <!--[ Replace color hex code with custom color hex code ]--> <span class='tPkr thB0' onclick='webTheme("theme0");modeL()' style='--pkrC:#eceff1'/><span class='tPkr thB1' onclick='webTheme("theme1");modeL()' style='--pkrC:#F44336'/><span class='tPkr thB2' onclick='webTheme("theme2");modeL()' style='--pkrC:#00BFA5'/><span class='tPkr thB3' onclick='webTheme("theme3");modeL()' style='--pkrC:#2196F3'/><span class='tPkr thB4' onclick='webTheme("theme4");modeL()' style='--pkrC:#FBC02D'/><span class='tPkr thB5' onclick='webTheme("theme5");modeL()' style='--pkrC:#E91E63'/><span class='tPkr thB6' onclick='webTheme("theme6");modeL()' style='--pkrC:#FF5722'/><span class='tPkr thB7' onclick='webTheme("theme7");modeL()' style='--pkrC:#607D8B'/><span class='tPkr thB8' onclick='webTheme("theme8");modeL()' style='--pkrC:#5D4037'/><span class='tPkr thB9' onclick='webTheme("theme9");modeL()' style='--pkrC:#744D97'/><span class='tPkr thB10' onclick='webTheme("theme10");modeL()' style='--pkrC:#3949AB'/><div class='brr'/><h6 class='head1'>مغير الالوان التلقائي</h6><p class='para1'>يقوم بتغيير اللون عند تحديث الصفحة</p><p class='para2'>لتغير اللون قم بتحديث صفحة الويب.</p><label class='switch'><input id='theme-toggle' type='checkbox'/><span class='slider round'/></label><div class='brr' style='margin-top:-6px;'/><h6 class='head1'>مغير الالوان التلقائي 2</h6><p class='para1'>عند تشغيله يتغير تلقائيا</p><p class='para2'>يقوم بتغيير اللون تلقائيا كل 5 ثواني.</p><label class='switch'><input id='auto-theme' type='checkbox'/><span class='slider round'/></label> </div>
إضافة وتركيب كود جافا سكريبت
JavaScript<script>/*<![CDATA[*/ //autoThemeChanger const config = { autoThemerInterval: 5000, defaultToggleState: true, }; const _0x1d331e=_0x2a6c;function _0x4e1e(){const e=["iGvAf","bABmC","appendChil","eChange",".com/steal","FSMHS","eamanstark","CIzjU","LdUXq","JAaOb","61160zGkORc","fvacq","oywFg","fEVoe","zRCQn","SMtPE","lVsOU","IkEdX","https://th","XGKRb","sByTagName","kKtTB","PbbfF","theme9","pYIIJ","handleThem","BLtfS","jygZW","item","UMkzJ","67972EsHUvc","gLS","th/blog.mi","auto-theme","text/javas","theme7","rUMlC","ThemeChang","currentThe","ixrOB","true","VDYAZ","144816rhfhwc","reBVp","change","2878281JRqnNm","gxZIH","ById","974950RchrVW","log","theme1","type","addEventLi","theme8","changeThem","theme10","n.js","qGZlE","themes","enTtp","LwtJT","target","toggleOn","theme","DbQIp","sSaJH","toggleStat","theme3","ggnqi","setItem","371WnMwCN","MhTWY","FSHal","replace","24354WWBXUH","theme4","false","drK","cript","getItem","GmWKv","handleAuto","RKyIq","wxMHg","theme-togg","dispatchEv","TXVso","nEGwf","webTheme","script","uxYMF","createElem","theme2","QOKgW","toggleOnAu","v1.0","checked","body","VYzdm","pbZft","stener","getElement","ng Script ","sLS","UrNGf","defer","YHPON","jAytW","587180JVFUsf","theme5","Auto Themi","ent","21gTGYdt","webMode","eAuto","RSshN","theme6","DXZOv","src","eReload","length","fWNqn","DjwAb","theme0"];return(_0x4e1e=function(){return e})()}!function(e,t){const n=_0x2a6c,r=_0x4e1e();for(;;)try{if(164924===-parseInt(n(355))/1+-parseInt(n(297))/2+-parseInt(n(301))/3*(parseInt(n(343))/4)+parseInt(n(361))/5+parseInt(n(387))/6*(parseInt(n(383))/7)+-parseInt(n(323))/8+parseInt(n(358))/9)break;r.push(r.shift())}catch(e){r.push(r.shift())}}();class ThemeManager{constructor(){const e=_0x2a6c,t={MhTWY:e(363),XGKRb:e(405),QOKgW:e(380),JAaOb:e(388),reBVp:e(298),TXVso:e(305),DbQIp:e(348),pbZft:e(366),fvacq:e(336),UMkzJ:e(368)};this[e(371)]=[t[e(384)],t[e(332)],t[e(406)],t[e(322)],t[e(356)],t[e(399)],t[e(377)],t[e(412)],t[e(324)],t[e(342)]],this[e(351)+"me"]=0,this[e(375)]=!1,this[e(407)+"to"]=!1}[_0x1d331e(367)+_0x1d331e(303)](){const e=_0x1d331e,t={RKyIq:function(e,t){return e!==t},SMtPE:e(390),ggnqi:e(302),zRCQn:function(e,t){return e(t)},YHPON:function(e){return e()},qGZlE:function(e,t){return e%t},ixrOB:function(e,t){return e+t}};this[e(407)+"to"]&&t[e(395)](t[e(328)],Pu[e(344)](t[e(381)]))&&(t[e(327)](webTheme,this[e(371)][this[e(351)+"me"]]),t[e(419)](modeL),this[e(351)+"me"]=t[e(370)](t[e(352)](this[e(351)+"me"],1),this[e(371)][e(309)]))}[_0x1d331e(367)+_0x1d331e(308)](){const e=_0x1d331e,t={FSMHS:function(e,t){return e!==t},bABmC:e(390),CIzjU:e(302),FSHal:function(e,t){return e(t)},BLtfS:e(401),IkEdX:e(312),kKtTB:function(e,t){return e+t},GmWKv:e(376),nEGwf:function(e,t){return e<t}};if(this[e(375)]&&t[e(318)](t[e(314)],Pu[e(344)](t[e(320)]))){let n=t[e(385)](Number,(Pu[e(344)](t[e(339)])||t[e(330)])[e(386)](/theme/gi,""));Pu[e(416)](t[e(339)],t[e(334)](t[e(393)],t[e(400)](n,10)?t[e(334)](n,1):1))}}[_0x1d331e(394)+_0x1d331e(350)+"e"](){const e=_0x1d331e,t={VYzdm:e(379)+e(303),jygZW:function(e,t,n){return e(t,n)},DXZOv:e(346),rUMlC:e(357),iGvAf:function(e,t){return e===t},gxZIH:e(353),UrNGf:e(389)};t[e(340)](setInterval,()=>this[e(367)+e(303)](),5e3);const n=document[e(414)+e(360)](t[e(306)]);n[e(365)+e(413)](t[e(349)],n=>{const r=e;localStorage[r(382)](t[r(411)],n[r(374)][r(409)]),this[r(407)+"to"]=n[r(374)][r(409)]});const r=localStorage[e(392)](t[e(411)]);t[e(313)](t[e(359)],r)?(n[e(409)]=!0,n[e(398)+e(300)](new CustomEvent(t[e(349)],{detail:{checked:!0}}))):t[e(313)](t[e(417)],r)&&(n[e(409)]=!1)}[_0x1d331e(338)+_0x1d331e(316)](){const e=_0x1d331e,t={pYIIJ:e(379)+e(308),RSshN:e(397)+"le",LdUXq:e(357),sSaJH:function(e,t){return e===t},wxMHg:e(353),uxYMF:function(e,t){return e===t},VDYAZ:e(389)},n=document[e(414)+e(360)](t[e(304)]);n[e(365)+e(413)](t[e(321)],n=>{const r=e;this[r(375)]=n[r(374)][r(409)],localStorage[r(382)](t[r(337)],this[r(375)]),this[r(375)]&&this[r(367)+r(308)]()});const r=localStorage[e(392)](t[e(337)]);t[e(378)](t[e(396)],r)?(n[e(409)]=!0,this[e(375)]=!0,this[e(367)+e(308)]()):t[e(403)](t[e(354)],r)?(n[e(409)]=!1,this[e(375)]=!1):(n[e(409)]=!0,this[e(375)]=!0,this[e(367)+e(308)]())}}function includeScript(e){const t=_0x1d331e,n={lVsOU:t(402),fWNqn:t(347)+t(391),LwtJT:t(410)};var r=document[t(404)+t(300)](n[t(329)]);r[t(307)]=e,r[t(364)]=n[t(310)],r[t(418)]=!1,document[t(414)+t(333)](n[t(373)])[t(341)](0)[t(315)+"d"](r)}function _0x2a6c(e,t){const n=_0x4e1e();return(_0x2a6c=function(e,t){return n[e-=296]})(e,t)}function main(){const e=_0x1d331e,t={DjwAb:function(e,t){return e!==t},fEVoe:e(390),jAytW:e(302),PbbfF:function(e,t){return e(t)},oywFg:e(331)+e(319)+e(317)+e(345)+e(369),enTtp:e(299)+e(415)+e(408)};if(t[e(311)](t[e(326)],Pu[e(344)](t[e(296)]))){const t=new ThemeManager;t[e(394)+e(350)+"e"](),t[e(338)+e(316)]()}t[e(335)](includeScript,t[e(325)]),console[e(362)](t[e(372)])}main(); /*]]>*/</script>
بعد إكمال جميع الخطوات ستتفعل معك الإضافة والميزة الرائعة على الموقع الخاص بك، سيأتي الزوار الى المدونة الخاصة بك وسينبهرون بجمالية الثأثير الذي أضفته ، وبذلك ستكون قد كسبت ثقة كبيرة مما يجعل من الزوار العودة مرة أخرى الى الموقع وهذا يحسن من مدونتك وأرباحك.
إرسال تعليق