طريقة إنشاء موقع معاينة قوالب بلوجر

مرحباً بعودتك متابع مدونة " تعلم بلوجر" هنا في هذا المقال ، طريقة إنشاء موقع معاينة قوالب بلوجر ، بعض المدونين لديهم قوالب بلوجر من تصميماتهم والبعض لديه من قوالب بلوجر لترويجها والأخر يسوق لقوالب بلوجر ولكن ليس لديهم قالب بلوجر أو تقنية لمعاينة قوالبهم ولتحميلها أو حتي لشرائها مثل المواقع المشهورة علي سبيل المثال موقع "EnvatoMarket" فهو يعرض جميع منتجاته داخل فريم خاص بة مع ازرار العودة والشراء من خلالة والكثير من المواقع الأخر لديها نفس التقنية ، وفي هذا المقال طريقة إنشاء موقع معاينة الروابط والشراء بأستخدام بلوجر نفس تقنية هذه المواقع لعرض قوالب بلوجر الخاصة بك مع امكانية وضع إعلان للزوار خلال معاينة القالب ولكن لا أنصح بإستخدام إعلانات جوجل في هذا القالب كل ما تحتاج إليه الأن هو إنشاء مدونة جديدة و تابع معي الطريقة.

طريقة إنشاء موقع معاينة قوالب بلوجر :

1. قم بتسجيل الدخول إلي مدونة بلوجر من هنا.
2. بعد إنشاء مدونة جديدة استخدم قالب التنظيف لمدونات بلوجر.
3. قم بتحميل قالب المعاينة من هنا.
4. أرفع القالب وتابع التعديل.

التعديل علي أكواد القالب :

1. بعد حفظ القالب أذهب إلي المظهر ثم تعديل HTML.
2. الآن ابحث داخل القالب باستخدام Ctrl+F عن كلمة "تعلم بلوجر" وإستبدلها باسم مدونتك.
3. ابحث داخل القالب باستخدام عن الرابط "blogger-educ" وإستبدله برابط مدونتك.
4. الأن أحفط القالب.

تركيب وتعديل نموذج المشاركة :

1. من القائمة الجانبية أنقر علي أعدادات ثم أختر مشاركات وتعليقات.
2. الأن أنقر علي علي إضافة الموجودة بجانب ثاني اختيار نموذج المشاركة.
3. وضع داخل المربع الأكواد التالية ثم قم بحفظ الإعدادات .

<!- 1-Preview Url here replace example.com -->
<a class="close-frame" href="http://example.com"><i class="fa fa-times"></i></a>

<!- 2-here put your template Url for Download, Purchase or Article -->
<!- In the folowing code replace cloud-download with shopping-cart for Purchase icon -->
<a class="blg-link" href="http://example.com/download">تحميل <i class="fa fa-cloud-download"></i></a>

<!- 3-Preview Url here replace example.com -->
<iframe id="iframe" src="http://example.com"></iframe>

تركيب قالب بلوجر للمعاينة :

1. بعد العودة للقائمة الرئيسية.
2. أنقر علي مشاركة جديدة " ستجد الأكواد السابقة موجودة داخل تاب HTML.
3. الأن أبحث  باستخدام Ctrl+F عن الرابط example. com وقم باستبدالة برابط القالب الذي تريد معاينته.
4. أبحث  باستخدام Ctrl+F عن الرابط example. com/download وقم باستبدالة برابط تحميل أو الشراء للقالب.
5. إذا أردت تغيير شكل أيقونة التحميل بشكل عربة الشراء قم بالبحث عن الكود cloud-download  واستبدله بهذا الكود  shopping-cart .

 

ملحوظة

يرجى زيارة مدونة بلوجر الخاص بك ورؤية هذه الإضافة، تعمل بشكل صحيح على مدونة بلوجر ، وإذا كان لديك أي مشكلة حول هذه المقالة ، فالرجاء تواصل معنا حتي يمكننا حل مشكلتك في أقرب وقت ممكن ، آمل أن تكون هذه المقالة مفيدة حقًا لك إذا أعجبك هذا المقال ،يمكنك كتابة تعليق بعد التجربة ومشاركتها على وسائل التواصل الاجتماعي مع أصدقائك .

نرحب بالإستفسار والتعليق

طريقة إنشاء صفحة فهرس في مدونة بلوجر لفهرسة المواضيع سريعاً "خريطة الموقع"

مرحباً بعودتك متابع مدونة " تعلم بلوجر" هنا في هذا المقال ، طريقة إنشاء صفحة فهرس في مدونة بلوجر ، هذه الإضافة لها العديد من الفوائد التي ستعود علي مدونة بلوجر الخاصة بك مثل سهولة أرشفة مواضيع المدونة اوتوماتيكياً لا تحتاج إلي الفهرسة بعد كل موضوع يدوياً ، ايضاً سهولة وصول عناكب البحث إلي مواضيع المدونة ، هذه الإضافة منسقة وبها خاصية الفلترة علي حسب الأقسام ولكل موضوع صورة وعنوان ووصف وبها ايضاَ خاصية إظهار المزيد من الموضيع و البحث عن موضوع معين  وهي ايضاَ صفحة متجاوبة مع جميع الشاشات ، تابع طريقة إنشاء وتركيب صفحة فهرس في مدونة بلوجر.

أداة فلترة للمواضيع والأقسام

طريقة إنشاء صفحة فهرس في مدونة بلوجر :

1. قم بتسجيل الدخول إلي مدونة بلوجر من هنا.
2. بعد هذا انتقل إلى الصفحات.
3. انقر علي صفحة جديدة.
4. قم بكتابة  sitemap  في مكان أسم الصحفة أو أسم المشاركة قم الأن بنشر الصفحة.
5. بعد حفظ الصفحة قم بالتعديل عليها من خلال النقر علي تعديل الموجودة أسفل الصفحة.
6. انتقل إلي وضع  HTML بدل من تأليف قم بمسح جميع الأكواد الموجودة.
7. الأن قم بلصق الكود التالي ثم أحفظ الصفحة.

<div dir="rtl" style="text-align: right;" trbidi="on"> <style scoped="" type="text/css"> /* CSS qaisi1web */ .post{margin:0}#comments{display:none}.toggle-comments{display:none!important}#table-outer{padding:7px 10px;margin:0 auto}#table-outer table{width:auto;margin:0 auto}#table-outer form{font:inherit}#table-outer label{margin:0 10px 0 0;padding:4px 0 0;display:block;text-align:right}#table-outer select[disabled]{opacity:.4}#post-searcher{display:block;margin:0;padding:0}#table-outer input,#table-outer select{font-family:Roboto,sans-serif!important;font-size:16px!important;font-weight:500!important;text-transform:capitalize!important;outline:0;color:#333!important;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;border:1px solid #dedede;border-radius:5px;margin:0 0 5px;padding:5px}#table-outer select option{min-height:1.4em!important}#table-outer input#feed-q{padding:5px 10px!important}#feed-container{overflow:hidden;position:relative;border-top:none;display:block;clear:both;margin:0 -10px 0 0;padding:0;list-style:none}#feed-container li{list-style:none;margin:0 0 10px;padding:0 10px 0 0;color:#555;width:33.33333%;text-align:center;float:left;display:inline;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}#feed-container li .inner{position:relative;overflow:hidden;word-wrap:break-word;border-radius:3px;background:#fff;color:#333;border:1px solid #dedede;margin:0;padding:30px;height:200px;line-height:1.2em}#feed-container li a{color:#333;font-weight:500}#feed-container li a.toc-read{text-decoration:none;color:#fff;margin-top:30px}#feed-container li .inner:hover a.toc-read{-webkit-animation-name:fadeInRight;animation-name:fadeInRight;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}#feed-container li .news-text{font-size:14px;margin-top:10px}#feed-container li .news-text div{display:none!important}#feed-container li img{margin:0;padding:0;width:100%!important;height:100%!important;position:absolute;top:0;left:0}#feed-container li .inner:hover img{transition:all 1s ease-in-out;-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;left:-500px;animation-fill-mode:both}@-webkit-keyframes fadeOutLeft{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}#result-desc{margin:0;padding:0}#result-desc div,#result-desc span{display:block;margin:0;padding:5px 0 7px;color:#D64D52}#result-desc div{color:inherit}#feed-nav{margin:10px 0 30px;text-align:center;font-weight:500}#feed-nav span{cursor:wait}@media screen and (max-width:1024px){#main-wrapper{padding:0 30px!important}#feed-container{display:block;clear:both;margin:0 -30px 0 0}#feed-container li{list-style:none;margin:0 0 30px;padding:0 30px 0 0}#feed-container li .inner{padding:20px}}@media screen and (max-width:960px){#main-wrapper{padding:0 20px!important}#feed-container{display:block;clear:both;margin:0 -20px 0 0}#feed-container li{list-style:none;margin:0 0 20px;padding:0 20px 0 0}#feed-container li .inner{padding:20px}}@media screen and (max-width:800px){#feed-container li{width:50%}}@media screen and (max-width:640px){#feed-container li .inner{height:150px}}@media screen and (max-width:414px){#table-outer table,#feed-container li{width:100%}#table-outer table,#table-outer label{text-align:center}#table-outer table td{display:block;margin:0 auto 5px;clear:both;float:none}#table-outer label{margin:0}#table-outer{padding:0}}@media (max-width:414px){#table-outer table td{text-align:center;display:block}#table-outer label{text-align:center;display:block;margin:0;padding:4px 0 0}#table-outer input,#table-outer select{margin:0 0 10px}}a.btn-default{color:#333}#feed-nav a,a.btn-primary,a.btn-success,a.btn-info,a.btn-warning,a.btn-danger{color:#fff}#feed-nav a,#feed-nav a:active,.btn,.btn:active{background-image:none}#feed-nav a,.parser,.btn,.btn-link{font-weight:400}#feed-nav a,.comment_form>a,.comments .paging-control-container .paging-control,.parser,.btn{border:1px solid transparent;border-radius:4px;margin-bottom:5px;font-size:14px;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;touch-action:manipulation;cursor:pointer;user-select:none;display:inline-block;padding:6px 12px}#feed-nav a:active:focus,#feed-nav a:focus,.comment_form>a:active:focus,.comment_form>a:focus,.comments .paging-control-container .paging-control:active:focus,.comments .paging-control-container .paging-control:focus,.parser:active:focus,.parser:focus,.btn:active:focus,.btn:focus{outline:0}#feed-nav a:focus,#feed-nav a:hover,#feed-nav a:hover,.btn:focus,.btn:hover{text-decoration:none;color:#333;outline:0}#feed-nav a:active,.btn:active{outline:0;box-shadow:inset 0 3px 5px rgba(0,0,0,.125);-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.btn-default{background:#fff;color:#333;border-color:#ccc}.btn-default:focus{background:#e6e6e6;color:#333;border-color:#8c8c8c}.btn-default:active,.btn-default:hover{background:#e6e6e6;color:#333;border-color:#adadad}#feed-nav a,.btn-primary,.comments .paging-control-container .paging-control,.parser{background:#337ab7;color:#fff;border-color:#2e6da4}#feed-nav a:focus,.comments .paging-control-container .paging-control:focus,.button-group button:disabled,.parser:focus,.btn-primary:focus{background:#286090;color:#fff;border-color:#122b40}#feed-nav a:active,#feed-nav a:hover,.comments .paging-control-container .paging-control:hover,.comments .paging-control-container .paging-control:active,.parser:active,.parser:hover,.btn-primary:active,.btn-primary:hover{background:#286090;color:#fff;border-color:#204d74}.btn-success{background:#5cb85c;color:#fff;border-color:#4cae4c}.btn-success:focus{background:#449d44;color:#fff;border-color:#255625}.btn-success:active,.btn-success:hover{background:#449d44;color:#fff;border-color:#398439}.btn-info{background:#5bc0de;color:#fff;border-color:#46b8da}.btn-info:focus{background:#31b0d5;color:#fff;border-color:#1b6d85}.btn-info:active,.btn-info:hover{background:#31b0d5;color:#fff;border-color:#269abc}.comment_form>a,.btn-warning{background:#f0ad4e;color:#fff;border-color:#eea236}.comment_form>a:focus,.btn-warning:focus{background:#ec971f;color:#fff;border-color:#985f0d}.comment_form>a:active,.comment_form>a:hover,.btn-warning:active,.btn-warning:hover{background:#ec971f;color:#fff;border-color:#d58512}.btn-danger{background:#d9534f;color:#fff;border-color:#d43f3a}.btn-danger:focus{color:#fff;border-color:#761c19;background:#c9302c}.btn-danger:active,.btn-danger:hover{color:#fff;border-color:#ac2925;background:#c9302c}.btn-link{border-radius:0;color:#337ab7}.btn-link,.btn-link:active{box-shadow:none;background:transparent;-webkit-box-shadow:none}.btn-link,.btn-link:active,.btn-link:focus,.btn-link:hover{border-color:transparent}.btn-link:focus,.btn-link:hover{text-decoration:underline;color:#23527c;background:transparent}#feed-nav a,.comment_form>a,.btn-lg{font-size:18px;padding:10px 16px;border-radius:6px;line-height:1.3333333}.parser,.btn-sm,.btn-xs{border-radius:3px;font-size:12px;line-height:1.5}.btn-sm{padding:5px 10px}.comments .paging-control-container .paging-control,.parser,.btn-xs{padding:1px 5px}#feed-nav a,.comment_form>a,.btn-block{display:block;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;width:100%;box-sizing:border-box}.btn-block+.btn-block{margin-top:5px}.comment_form>a+a{border-color:#fff;padding:0;margin-bottom:0;background:#fff} </style> <div id="table-outer"> <table><tbody> <tr> <td><label for="feed-order"> تصنيف المنشورات : </label></td> <td><select id="feed-order"> <option selected="" value="published">المشاركات الأخيرة</option> <option value="updated">الوظائف التي تم تحديثها مؤخرا</option> </select></td> </tr> <tr> <td><label for="label-sorter">تصنيف الأقسام : </label></td> <td><select disabled="" id="label-sorter"> <option selected="">الأقسام . . . .</option> </select></td> </tr> <tr> <td><label for="feed-q">البحث عن مقالات بحسب الكلمة الرئيسية : </label></td> <td><form id="post-searcher"> <input id="feed-q" placeholder="ابحث هنا . . ." type="text" /> </form> </td> </tr> </tbody> </table> </div> <header id="result-desc"></header> <ul id="feed-container"></ul> <div id="feed-nav"> </div> <script src="https://rawgit.com/assadalqaisi/qaisi1web/master/qaisi1web-ux10-sitemap.js"></script> </div>

 

ملحوظة

يرجى زيارة مدونة بلوجر الخاص بك ورؤية هذه الإضافة، تعمل بشكل صحيح على مدونة بلوجر ، وإذا كان لديك أي مشكلة حول هذه المقالة ، فالرجاء تواصل معنا حتي يمكننا حل مشكلتك في أقرب وقت ممكن ، آمل أن تكون هذه المقالة مفيدة حقًا لك إذا أعجبك هذا المقال ،يمكنك كتابة تعليق بعد التجربة ومشاركتها على وسائل التواصل الاجتماعي مع أصدقائك .

نرحب بالإستفسار والتعليق

إضافات بلوجر تأثير تحميل الصفحة لمدونات بلوجر

مرحباً بعودتك متابع مدونة " تعلم بلوجر" هنا في هذا المقال ، إضافات بلوجر تأثير تحميل الصفحة لمدونات بلوجر ، فائدة هذه الإضافة هي انتظار الزائر لبضع ثواني حتي يتم تحميل الصفحة من محتوي وإعلانات وصور الموجودة بداخل مدونتك ، ولها ايضاً تأثير كبيرفي زيادة وقت مشاهدة الإعلان ، ففي بعض الأحيان يكون الزائر علي عجله وقد يمر بسرعة إلي أخر المنشور أو الصفحة بدون تحميل كامل للمدونة وبالتالي قد يفقد رؤيتة للإعلان أو المحتوي كامل وايضاً الصور ذات المساحات والحجم الكبير ولكن بعض إضافتك لهذا التأثير سيستمتع الزائر خلال بضع ثواني لمشاهدة التأثير وفي نفس الوقت يتم تحميل المدونة والصفحة بالكامل بعد ذلك يذهب التأثير تدريجياً ويبدأ الزائر برؤية المحتوي كامل وتستفيد أنت كصاحب المدونة بزيادة وقت الجلوس والمشاهدة داخل مدونتك. كل هذا يحصل في خلال بضع ثواني فقط ، تم إضافة أكثر من شكل للتأثير فقط تابع الشرح ...هيا لنبداء.    

طريقة تركيب تأثير تحميل الصفحة لمدونات بلوجر :

1. قم بتسجيل الدخول إلي مدونة بلوجر من هنا.
2. بعد هذا انتقل إلى مظهر القالب.
3. انقر فوق تعديلHTML.
4. الآن أبحث داخل القالب باستخدام Ctrl+F عن <body/> .
5. فوقة مباشر قم بلصق الكود التالي .

<script type='text/javascript'> //<![CDATA[ // Preloader $(window).load(function(){$(".spinner").fadeOut(),$("#preloader").delay(350).fadeOut("slow"),$("body").delay(350).css({overflow:"visible"})}); //]]> </script>

تركيب تأثير تحميل الصفحة لمدونات بلوجر (1)

1. الآن أبحث داخل القالب باستخدام Ctrl+F عن <body> .
2. أسفله مباشر قم بلصق الكود التالي .
3. أحفظ القالب الأن.
4. لمعاينة التأثير قبل التركيب 

<div id='preloader'> <svg class='spinner' height='50px' viewBox='0 0 66 66' width='50px' xmlns='http://www.w3.org/2000/svg'> <circle class='path' cx='33' cy='33' fill='none' r='30' stroke-linecap='round' stroke-width='4'/> </svg> </div> <style type='text/css'> /* Preloader */ #preloader{overflow:hidden;background:#fff;left:0;right:0;top:0;bottom:0;position:fixed;z-index:9999} .spinner{position:absolute;top:calc(50% - 20px);left:calc(50% - 20px);animation:rotator 1.4s linear infinite} @keyframes rotator{0%{transform:rotate(0deg)}100%{transform:rotate(270deg)}} .path{stroke-dasharray:187;stroke-dashoffset:0;transform-origin:center;animation:dash 1.4s ease-in-out infinite,colors 5.6s ease-in-out infinite} @keyframes colors{0%{stroke:#4285F4}25%{stroke:#DE3E35}50%{stroke:#F7C223}75%{stroke:#1B9A59}100%{stroke:#4285F4}} @keyframes dash{0%{stroke-dashoffset:187}50%{stroke-dashoffset:46.75;transform:rotate(135deg)}100%{stroke-dashoffset:187;transform:rotate(450deg)}} </style>

تركيب تأثير تحميل الصفحة لمدونات بلوجر (2)

1. الآن أبحث داخل القالب باستخدام Ctrl+F عن <body> .
2. أسفله مباشر قم بلصق الكود التالي .
3. أحفظ القالب الأن.
4. لمعاينة التأثير قبل التركيب 

div id='preloader'> <div id='container' class='spinner'> <div id='dot'></div> <div class='step' id='s1'></div> <div class='step' id='s2'></div> <div class='step' id='s3'></div> </div> </div> <style type='text/css'> #preloader{overflow:hidden;background:#54B4F5;left:0;right:0;top:0;bottom:0;position:fixed;z-index:9999} #container{margin:-45px -60px;width:120px;height:90px;position:absolute;top:50%;left:50%} #dot{background:#FFF;border-radius:50%;width:30px;height:30px;position:absolute;bottom:30px;left:27px;transform-origin:center bottom;animation:dot .6s ease-in-out infinite} @-webkit-keyframes dot{0%{transform:scale(1,.7)}20%{transform:scale(.7,1.2)}40%{transform:scale(1,1)}50%{bottom:100px}46%{transform:scale(1,1)}80%{transform:scale(.7,1.2)}90%{transform:scale(.7,1.2)}100%{transform:scale(1,.7)}} .step{position:absolute;width:30px;height:30px;border-top:2px solid #FFF;top:0;right:0} @-webkit-keyframes anim{0%{opacity:0;top:0;right:0}50%{opacity:1}100%{top:90px;right:90px;opacity:0}} #s1{animation:anim 1.8s linear infinite} #s2{animation:anim 1.8s linear infinite -.6s} #s3{animation:anim 1.8s linear infinite -1.2s} </style>

تركيب تأثير تحميل الصفحة لمدونات بلوجر (3)

1. الآن أبحث داخل القالب باستخدام Ctrl+F عن <body> .
2. أسفله مباشر قم بلصق الكود التالي .
3. أحفظ القالب الأن.
4. لمعاينة التأثير قبل التركيب 
   

<div id='preloader'> <div class='loader spinner'> <div class='l_main'> <div class='l_square'><span></span><span></span><span></span></div> <div class='l_square'><span></span><span></span><span></span></div> <div class='l_square'><span></span><span></span><span></span></div> <div class='l_square'><span></span><span></span><span></span></div> </div> </div> </div> <style type='text/css'> #preloader{overflow:hidden;background:#FA3663;left:0;right:0;top:0;bottom:0;position:fixed;z-index:9999} .spinner{list-style:none;margin:0;padding:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);} .loader{height:100%;width:100%} .loader .l_main{position:absolute;top:50%;left:50%;width:172px;height:128px;margin:0;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)} @media (max-width:550px){.loader{-webkit-transform:scale(0.75);transform:scale(0.75)}} @media (max-width:440px){.loader{-webkit-transform:scale(0.5);transform:scale(0.5)}} .l_square{position:relative} .l_square:nth-child(1){margin-left:0px} .l_square:nth-child(2){margin-left:44px} .l_square:nth-child(3){margin-left:88px} .l_square:nth-child(4){margin-left:132px} .l_square span{position:absolute;top:0px;left:20px;height:36px;width:36px;border-radius:2px;background-color:#FFFFFF} .l_square span:nth-child(1){top:0px} .l_square span:nth-child(2){top:44px} .l_square span:nth-child(3){top:88px} .l_square:nth-child(1) span{-webkit-animation:animsquare1 2s infinite ease-in;animation:animsquare1 2s infinite ease-in} .l_square:nth-child(2) span{-webkit-animation:animsquare2 2s infinite ease-in;animation:animsquare2 2s infinite ease-in} .l_square:nth-child(3) span{-webkit-animation:animsquare3 2s infinite ease-in;animation:animsquare3 2s infinite ease-in} .l_square:nth-child(4) span{-webkit-animation:animsquare4 2s infinite ease-in;animation:animsquare4 2s infinite ease-in} .l_square span:nth-child(1){-webkit-animation-delay:0.00s;animation-delay:0.00s} .l_square span:nth-child(2){-webkit-animation-delay:0.15s;animation-delay:0.15s} .l_square span:nth-child(3){-webkit-animation-delay:0.30s;animation-delay:0.30s} @keyframes animsquare1{0%,5%,95%,100%{transform:translate(0px,0px) rotate(0deg)}30%,70%{transform:translate(-40px,0px) rotate(-90deg)}} @keyframes animsquare2{0%,10%,90%,100%{transform:translate(0px,0px) rotate(0deg)}35%,65%{transform:translate(-40px,0px) rotate(-90deg)}} @keyframes animsquare3{0%,15%,85%,100%{transform:translate(0px,0px) rotate(0deg)}40%,60%{transform:translate(-40px,0px) rotate(-90deg)}} @keyframes animsquare4{0%,20%,80%,100%{transform:translate(0px,0px) rotate(0deg)}45%,55%{transform:translate(-40px,0px) rotate(-90deg)}} </style>

ملحوظة

يرجى زيارة مدونة بلوجر الخاص بك ورؤية هذه الإضافة، تعمل بشكل صحيح على مدونة بلوجر ، وإذا كان لديك أي مشكلة حول هذه المقالة ، فالرجاء تواصل معنا حتي يمكننا حل مشكلتك في أقرب وقت ممكن ، آمل أن تكون هذه المقالة مفيدة حقًا لك إذا أعجبك هذا المقال ،يمكنك كتابة تعليق بعد التجربة ومشاركتها على وسائل التواصل الاجتماعي مع أصدقائك .

نرحب بالإستفسار والتعليق

قالب التنظيف لمدونات بلوجر

مرحباً بعودتك متابع مدونة " تعلم بلوجر" هنا في هذا المقال ، قالب التنظيف لمدونات بلوجر ، هل واجهتك مشكلة عند تغيير قالب المدونة الخاصة بك بترك أثر لقالب بلوجر القديم من إضافات أو أقسام في السيدبار أو تغير في حجم الصور ؟ هنا لك شرح تخطي كل هذه المشاكل مما يجعلك تسطيع تركيب قالب بلوجر الجديد بجميع مميزاته بدون أي أخطاء أو مشاكل أو أي أثر قم بتركيب هذا القالب التالي سوف يقوم بمسح كل شئ بما في ذلك الإضافات للقالب القديم ويجعلك مستعد لرفع القالب الجديد تابع الشرح..

شرح طريقة تركيب قالب التنظيف لمدونات بلوجر "Blogger Cleaning Template" :

1. قم بتسجيل الدخول إلي مدونة بلوجر من هنا.
2. بعد هذا انتقل إلى مظهر القالب.
3. انقر فوق تعديلHTML.
4. الآن قم بمسح كل أكواد القالب القديم باستخدام  Ctrl+A ثم Delete .
5. قم بوضع أكواد قالب التنظيف التالية .
6. الأن أحفظ القالب.
7. يمكنك الأن رفع القالب الجديد بدون أي أخطاء.

<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html> <html b:css='false' b:js='false'> <head> ----------------------------------------------- Name : Blogger Cleaning code Templates URL : https://blogger-educ.blogspot.com ----------------------------------------------- */ <title>لقد تم تنظيف هذه المدونة</title> <b:if cond='data:i'> <b:skin> <![CDATA[]]> </b:skin> </b:if> </head> <body> <b:if cond='data:i'> <b:section id='i'/> </b:if> </body> </html>

ملحوظة

يرجى زيارة مدونة بلوجر الخاص بك ورؤية هذه الإضافة، تعمل بشكل صحيح على مدونة بلوجر ، وإذا كان لديك أي مشكلة حول هذه المقالة ، فالرجاء تواصل معنا حتي يمكننا حل مشكلتك في أقرب وقت ممكن ، آمل أن تكون هذه المقالة مفيدة حقًا لك إذا أعجبك هذا المقال ،يمكنك كتابة تعليق بعد التجربة ومشاركتها على وسائل التواصل الاجتماعي مع أصدقائك .

نرحب بالإستفسار والتعليق

طريقة تغيير لون الهيدر في مدونة بلوجر للهواتف الذكية Blogger-Theme-Color

مرحباً بعودتك متابع مدونة "تعلم بلوجر" هنا في هذا المقال، طريقة تغيير لون الهيدر في مدونة بلوجر للهواتف الذكية. هذه الأشياء البسيطه قد تترك أثر وطابع جيد لزائر أو مستخدم مدونة بلوجرحيث يمكنك من خلال هذه الإضافة تغيير لون الهيدر للمتصفح علي الجوال علي أن يكون بنفس لون الثيم أو القالب المستخدم في مدونة بلوجر الخاصة بك و يمكنك ايضاً استخدام عدة الوان متناسقه في نفس الوقت اتمني أن تنال اعجابكم بعد التجرية وهي أمنه تماماَ علي المدونة.

شرح طريقة تغيير لون الهيدر في مدونة بلوجر للهواتف الذكية "Blogger-Theme-Color":

1. قم بتسجيل الدخول إلي مدونة بلوجر من هنا.
2. بعد هذا انتقل إلى مظهر القالب.
3. انقر فوق تعديلHTML.
4. الآن ابحث داخل القالب باستخدام Ctrl+F عن <head> .
5. أسفله مباشر قم بلصق الكود التالي .
6. بعد لصق الكود، أحفظ القالب.
7. يمكنك تغير الألوان كما تريد المحددة باللون الأصفر في الأكواد.

  <!-- blogger-educ.blogspot.com widget --> <!-- Chrome, Firefox OS and Opera --> <meta name="theme-color" content="#8164af"/> <!-- Windows Phone --> <meta name="msapplication-navbutton-color" content="#8164af"/> <!-- iOS Safari --> <meta name="apple-mobile-web-app-capable" content="yes"/> <meta name="apple-mobile-web-app-status-bar-style" content="blueviolet"/> <!-- /blogger-educ.blogspot.com widget -->

• إليك أحد أشهر المواقع التي تدعمك بأكواد الألوان إذا لم تكون تستخدم برنامج أدوبي فوتوشوب من هنا .

ملحوظة

يرجى زيارة مدونة بلوجر الخاص بك ورؤية هذه الإضافة، تعمل بشكل صحيح على مدونة بلوجر ، وإذا كان لديك أي مشكلة حول هذه المقالة ، فالرجاء تواصل معنا حتي يمكننا حل مشكلتك في أقرب وقت ممكن ، آمل أن تكون هذه المقالة مفيدة حقًا لك إذا أعجبك هذا المقال ،يمكنك كتابة تعليق بعد التجربة ومشاركتها على وسائل التواصل الاجتماعي مع أصدقائك .

نرحب بالإستفسار والتعليق

طريقة نقل مواضيع مدونة بلوجر إلى مدونة أخرى على بلوجر

مرحباً بك متابع مدونة " تعلم بلوجر" هنا في هذا المقال ، نتحدث عن طريقة نقل مواضيع مدونة بلوجر إلي مدونة أخري علي بلوجر، علماً بأن الكثير من المدونين يتعرضون لوضع أكواد خاطئة قد تدمر المدونة بأكملها أو يتعرضون لحظر بشكل مفاجئ للمدونات الخاصة بهم إما من خلال فهرسة جوجل أو من خلال جوجل أدسنس، ففي هذا المقال سوف نتعلم الطريقة الصحيحة لنقل المواضيع من المدونة القديمة إلي المدونة الجديدة. تابع معي الخطوات..

استيراد محتوي بلوجر، نقل مواضيع بلوجر، نسخة إحتياطية محتوي بلوجر

Import blog posts, move blog posts, backup blog content

خطوات نقل مواضيع مدونة بلوجر إلى مدونة أخرى على بلوجر Blogger:

الخطوة الأولي:

1. قم بتسجيل الدخول إلي مدونة بلوجر من هنا.
2. الخطوة الأولي بعد تسجيل الدخول أختر المدونة التي تريد سحب المواضيع منها.
3. على الجانب الأيمن من الصفحة ، انقر فوق "إعدادات" ، ثم تحت إعدادات أختر "أخري" ستظهر لك على الشاشة كما تظهر الصورة التالية.
4. أنقر علي الأحتفاظ بنسخة احتياطية من المحتوي.
5. الأن تظهر لك شاشة صغيرة أنقر علي "حفظها علي جهاز الكمبيوتر" يتم الأن تحميلها علي جهاز الكمبيوتر الخاص بك.

الخطوة الثانية:

1. نفس الخطوات السابقة ولكن أختر المدونة التي تريد رفع المواضيع عليها.
2. على الجانب الأيمن من الصفحة ، انقر فوق "إعدادات" ، ثم تحت إعدادات أختر "أخري".
3. هذه المرة سوف نختار " استرداد محتوي" .
4. من خلال الشاشة الصغيرة أختر " الاسترداد من جهاز كمبيوتر" وقم برفع ما قمت بتحميلة في الخطوة الأولي.
5. أخر خطوة وهي أنتظر حتي يتم التحميل قد يستغرق بعد الوقت علي حسب حجم المواضيع .

ملحوظة

في بعض الأحيان لم تتم العملية بنجاح فقط كل ما عليك هو إعادة الرفع مرة أخري. يرجى زيارة مدونة بلوجر الخاص بك ورؤية هذه الإضافة، تعمل بشكل صحيح على مدونة بلوجر ، وإذا كان لديك أي مشكلة حول هذه المقالة ، فالرجاء تواصل معنا حتي يمكننا حل مشكلتك في أقرب وقت ممكن ، آمل أن تكون هذه المقالة مفيدة حقًا لك إذا أعجبك هذا المقال ،يمكنك كتابة تعليق بعد التجربة ومشاركتها على وسائل التواصل الاجتماعي مع أصدقائك .

نرحب بالإستفسار والتعليق

شرح طريقة إنشاء ملف روبوتس robots.txt مخصص لمدونة بلوجر

مرحباً بعودتك متابع مدونة "تعلم بلوجر" هنا في هذا المقال ، شرح طريقة إنشاء ملف robots.txt مخصص لمدونة بلوجر بالتفصيل للمبتدئين بالصور , الطريقة الصحيحة لإنشاء ملف روبوت robots.txt مخصص لمدونات بلوجر بالتفصيل للمبتدئين وماهي اهمية ملف روبوت في ارشفة محتوي موقعك. في البداية دعنا نوضح لك معني كلمة روبوتس فايل robots.txt :

ماهو ملف روبوتس Robots.txt وما اهميته؟

باختصار شديد ملف روبوت Robots.txt هو ملف يقوم بتوجيه روبوتات وعناكب البحث للصفحات المهمة علي موقعك او الصفحات التي سيتم ارشفتها حيث يخبر هذا الملف عناكب البحث بان هذه الصفحات هي الاهم علي موقعك وهي التي سوف يتم ارشفتها, ويبعدهم ايضاً عن الصفحات غير المهمة والتي لايجب علي عناكب البحث ارشفتها واظهارها علي محركات البحث.

افضل ملف روبوتس robots.txt مخصص

ملف روبوتس مخصص لمدونات بلوجر

 

User-agent: Mediapartners-Googl
Disallow:
User-agent: *
Disallow:/search
Allow:/
Sitemap: http://www.blogger-educ.com/sitemap.xml

ملف الروبوت مكون من 3 أجزاء مخصصة هنا شرحها بالتفصيل:

الجزء الاول هو : User-agent: Mediapartners-Google 

وهو مخصص بشكل اساسي للاعلانات علي مدونتك وتحديداً جوجل ادسنس حيث يتم تحليل مدونتك بعد اضافة هذا الكود لمعرفة محتوي موقعك واضافة اعلانات تتناسب مع محتوي موقعك بشكل افضل. 

الجزء الثاني هو : User-agent: * 

هذا الجزء من الكود مخصص للمنع والسماح بالزحف لملفات معينة داخل محتوي موقعك فمثلاً اذا كنت تريد السماح بارشفة كل محتوي موقعك فسنضيف بعد هذا الامر مباشرة كلمة Allow: / كما هو في ملف الروبوت المرفق في الشرح اما اذا كنت تريد منع الزحف الي عمليات البحث مثلاً داخل موقعك فقم باضافة هذا الامر Disallow: /search. 

الجزء الثالث هو : Sitemap

وهو الملف الذي يحتوي علي محتوي موقعك بالكامل بشكل متجدد حيث يتم فحص هذا الملف بشكل مستمر في كل مرة يدخل فيها عناكب البحث علي موقعك في حالة ما اذا قمت باضافة تدوينة جديدة الي موقعك لكي يتم ارشفتها.

شرح إضافة ملف روبوت robots.txt مخصص لمدونات بلوجر

توجة بالدخول الي مدونتك علي بلوجر قم بالدخول الي الاعدادات ثم تفضيلات البحث كما هو موضح بالصورة ثم اضغط علي تعديل: 

• لا تنسي استبدال الجزء فوق الخط الأحمر في الصورة التالية برابط موقعك ثم اضغط علي حفظ التغيرات بعد الانتهاء.

• بعد الحفظ يمكنك تجربة الملف بالدخول الي رابط موقعك بالشكل التالي