شرح طريقة إضافة شريط علوي للأقسام على قمة رأس مدونة بلوجر

| | هناك 3 تعليقات |






السلام عليكم ورحمة الله وبركاته 



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





















بعد ذلك إضغط على تحرير HTML كما هو موضح في الصورة :

















ثم إضغط على متابعة كما هو موضح في هاته الصورة :




























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
















ثم بعد ذلك إضغط في لوحة المفاتيح على  CTRL+F جهازك على  على أساس ضهور مربع البحث وقم بالبحث عبر على هذا الكود: 





<div class='menu-primary-wrap'>


شاهد الصورة 








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





<li><a href='http://arab-googl.blogspot.com//search/label/hola?&amp;max-results=11'>hola</a></li>
</ul>


شاهد الصورة









ملاحظة :


تقوم بتغيير ما باللون الأحمر داخل الكود  إلى التسمية التي تريدها 


تقوم بتغيير ما باللون الأزرق داخل الكود إلى رابط مدونتك 






-وإذا أحببت تسميات أخرى تقوم بتكرارنفس الكود الاول





أتمنى أن الدرس قد أفادكم 






تابع القراءة Résuméabuiyad

إضافة أداة آخر مواضيع جميع الأقسام للمدونة

| | ليست هناك تعليقات |

السلام عليكم ورحمة الله وبركاته


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














الإضافة  كما هي مبينة في الصورة يمكن إضافتها فقط بالذهاب إلى لوحة تحكم مدونتك والضغط علىالتخطيط ثم إضافة أداة وتختار html/java script ثم تقوم بلصق هذا الكود :









<div style="background: none repeat scroll 0% 0% rgb(242, 242, 242); border: 1px solid rgb(204, 204, 204); height: 200px; overflow: auto; padding: 10px;">
<span id="pbl_labels"></span>
<div id="pbl_posts">
Recent Posts </div>

<script type="text/javascript">
var jumlah_maksimum_post = 10;
var dengan_ringkasan = true;
var jumlah_karakter_ringkasan = 100;
</script>

<script src="http://my-tqarob.googlecode.com/svn/trunk/recentpostsbylabel.js">
</script>

<script src="http://arab-googl.blogspot.com/feeds/posts/default?alt=json-in-script&amp;callback=onLoadFeed">
</script></div>







*لتخصيص الإضافة قم فقط بتغيير الرابط باللون الأحمر إلى رابط مدونتك

تابع القراءة Résuméabuiyad

أداة جميلة للنشر في المواقع الإجتماعية للمدونات

| | ليست هناك تعليقات |

السلام عليم ورحمة الله وبركاته 


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








لإضافتها إلى مدونتك ، كل ماعليك فعله الذهاب إلى لوحة التحكم ثم تضغط على التخطيط ، ثم إضافة أداة ، ثم تختار html/java script ، وتقوم بلصق هذا الكود في المربع:







<script type="text/javascript">var switchTo5x=true;</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript" src="http://s.sharethis.com/loader.js"></script>
<script>
var options={ "publisher": "074821ed-063e-4ae5-bad9-3e26ecf249f3", "position": "left", "ad": { "visible": true, "openDelay": 5, "closeDelay": 0}, "chicklets": { "items": ["facebook", "googleplus", "twitter", "linkedin", "email", "pinterest"]}};
var st_hover_widget = new sharethis.widgets.hoverbuttons(options);
</script>








قم بالضغط على حفظ ، ومبروك عليك الإضافة

تابع القراءة Résuméabuiyad

طريقة اضافة قائمه افقيه تحتوي على اربع اضافات هامه لقوالب بلوجر

| | ليست هناك تعليقات |



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



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

]]></b:skin>

وضع قبلها او فوقها مباشرة الكود  :التالي 



searchbar{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnVvAb5-T-vqZiZUeErn7lURSjtn-1OpQPwTgpK0NT6lpjrX0Y6xKtmF068K5POJCtC8xOk7SVNMyJmm_1SseoWmGIZdfKQI_YsPl6k7_wtguzRw7cZnUG9U1YAWGQoxEiZmVB5xVkA5Y/s1600/searchbar.png) repeat-x bottom;width:960px;height:40px;font-size:12px;font-family:tahoma, arial, Verdana;color:#616161;font-weight:500;margin-bottom:0px;padding:0}

#searchbarleft{width:290px;float:left;margin:0;padding:7px 0 0 10px}

#searchbarmiddle{width:280px;float:left;margin:0;padding:4px 0 0}

#searchbarright{width:190px;float:left;margin:0;padding:8px 0 0}

#searchbarright1{width:190px;float:left;margin:0;padding:2px 0 0}

#searchbarform{display:inline;overflow:hidden;margin:10px 0 0}

#searchbarformheader{margin:0}

#cat{background:#fff;width:220px;color:#222;font-family:tahoma, arial, Verdana;display:inline;margin:3px;padding:3px 2px 2px}

#subscribe{overflow:hidden;margin:0;padding:0 0 5px}

#subbox{background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIWUSuzz6adhdYRUDahlnzL3D1r7dHaQEvMSvkySzZQ20a-qpO04tMKN3f4qu3C-LYf9daHEwLOSyoJm2ebmWKb856YHj5yZDpu0lijEIjadHIVvaHBZIm74vm0m5DPTA635r3hDhqaKE/s1600/email.png) no-repeat scroll 4px center;font:normal 12px tahoma;color:#666;text-decoration:none;border:1px solid #aaa;height:14px;width:170px;margin:0;padding:5px 0 4px 34px}

#subbutton{background:#999;color:#FFF;font:12px tahoma;font-weight:700;text-decoration:none;border:1px solid #666;margin-left:5px;padding:3px 5px}

ul.isocial{list-style:none;margin:0;padding:5px 20px 0 0}

ul.isocial li{float:right;margin:0 5px;padding:0}

ul.isocial li a{float:right;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiq2GHFa0JbJcVQQE7x2JlrA3Kqb0RC8fIVf1YehII6megzdSTPkLJxlKFipIkGhm_J10fHaMgRP9xTGCoZSoAloy48bRDgEQ-MmkKtRRELvAmgA2cSCAVm4XPLtIyGQt_FcrPBbH9KVdg/s1600/social+letter.png);background-position:0 0;background:repeat:no-repeat;display:inline-block;text-indent:-9999px;overflow:hidden;width:24px;height:24px;position:relative}

ul.isocial li a.rss{background-position:0 0}

ul.isocial li a.rss:hover{background-position:0 -25px}

ul.isocial li a.facebook{background-position:-25px 0}

ul.isocial li a.facebook:hover{background-position:-25px -25px}

ul.isocial li a.twitter{background-position:-50px 0}

ul.isocial li a.twitter:hover{background-position:-50px -25px}

ul.isocial li a.google{background-position:-75px 0}

ul.isocial li a.google:hover{background-position:-75px -25px}

ul.isocial li a.youtube{background-position:-100px 0}

ul.isocial li a.youtube:hover{background-position:-100px -25px


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

 ولكن يجب ان تكون الاداه تحت منطقة الهيدر مباشره او فوق او تحت القائمه الافقيه بمدونتك ان اردت الاحتفاظ بها

<div id='searchbar'>

<div id='searchbarleft'>

<form action='http://feedburner.google.com/fb/a/mailverify' id='subscribe' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=blogspot/htbgh&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'><input id='subbox' name='email' onblur='if (this.value == &apos;&apos;) {this.value = &apos;Enter your email address...&apos;;}' onfocus='if (this.value == &apos;Enter your email address...&apos;) {this.value = &apos;&apos;;}' type='text' value='ا�تب بر�د� ��ا...'/><input name='uri' type='hidden' value='blogspot/htbgh'/><input name='loc' type='hidden' value='en_US'/><input id='subbutton' type='submit' value='Enter'/></form>

</div>

<div id='searchbarmiddle'>

<b:section id='labelsmenu' maxwidgets='1'>

<b:widget id='Label1' locked='true' title='Kategori' type='Label'/>

</b:section>

</div>

<div id='searchbarright'>

<form action='http://www.google.com/search' method='get' target='_blank'>

<input name='sitesearch' style='display:none;' value='http://johny-storage.blogspot.com'/>

<input id='search-box' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;;' style='width:120px;border:none;padding:3px 7px; font:12px Arial;color:#666; background:#fff;border:1px solid #ccc;' type='text' value='بحث سر�ع ...'/><input align='top' id='search-btn' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6btXeMxa8dm5RLjTYOvFuw2d4jqYqc-rdaM91tEfR4E9IgQfIbzVjRTrTl0CEdGS0f8Hnoz9-fQvSFvX3kKZIsOSR2wJ05wwXEDW8Nn77ekL2-FztagKQcPITrWdie-lmOKZlDu7njZQ/s1600/search.jpg' style='padding:0px 3px;' type='image' value='Search'/>

</form>

</div>

<div id='searchbarright1'>

<ul class='isocial'>

<li><a class='rss' href='#' target='_blank' title='Subscribe via RSS'/></li>

<li><a class='facebook' href='#' target='_blank' title='Become a Fan'/></li>

<li><a class='twitter' href='#' target='_blank' title='Follow Us'/></li>

<li><a class='google' href='#' target='_blank' title='Google Plus Profile'/></li>

<li><a class='youtube' href='#' target='_blank' title='Watch The Video'/></li>

</ul>

</div>

</div>




قم بحفظ التغييرات على القالب . انتهى ...استفساراتكم مرحبا بها



تابع القراءة Résuméabuiyad

إدراج إعلانات أدسنس داخل مواضيع بلوجر

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

انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F).

 

<b:if cond='data:post.includeAd'> <data:adEnd/> <data:adCode/> <data:adStart/> </b:if>


ثم قم بإستبداله بهذا الكود



:  













<!-- http://www.pergola-aluminium.org/ adsense in post mod. START -->

<b:if cond='data:blog.pageType != "item"'> <b:if cond='data:post.includeAd'> <data:adEnd/> <data:adCode/> <data:adStart/> </b:if> </b:if>

<!-- http://www.pergola-aluminium.org adsense in post mod. END -->




قم بالبحث عن الكود التالي





<data:post.body/>


ثم قم بلصق هذا الكود قبله إذا كنت تريد إدراج الإعلان فوق الموضوع, وبعده إذا كنت تريد إدراج الإعلان تحت الموضوع
<!-- http://www.pergola-aluminium.org adsense in post mod. START -->

<b:if cond='data:blog.pageType == "item"'> <b:if cond='data:post.includeAd'> <data:adEnd/> <font size="0"><a href="http://www.nuancier-peinture.org">nuancier peinture</a></font><data:adCode/> <data:adStart/> </b:if> </b:if>

<!-- http://www.pergola-aluminium.org adsense in post mod. END -->






وهناك طريقة أخرى أثبتت جدارتها ،وتستحق التطبيق , حيث يمكنك من الآن فصاعدا إدراج إعلانات جوجل أدسنس في أي مكان تريد على مدونتك ،مما يسهل ظهورها على زوار المدونة ،وكما تلاحظ في مدونتي أن إعلانات جوجل أدسنس توجد بين سطور المقالات التي أكتبها .

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

انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحرير, ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.

قم بالبحث عن الكود التالي : إذا وجدت منه إثنين فإختر الكود الثانيتذكير:لا تنسى أخي المدون أن تأخد نسخة إحتياطية لمدونتك تجنبا لأي أخطاء

<data:post.body/>




ثم إستبدله بالكود التالي :





<b:if cond='data:blog.pageType == &quot;item&quot;'>


<div expr:id='"aim1" + data:post.id'></div>
<div style="clear:both; margin:10px 0">
ضع كود أدسنس هنا،بعد تحويله
</div>
<div expr:id='"aim2" + data:post.id'>
<data:post.body/>
</div>
<script type="text/javascript">
var obj0=document.getElementById("aim1<data:post.id/>");
var obj1=document.getElementById("aim2<data:post.id/>");
var s=obj1.innerHTML;
var r=s.search(/\x3C!-- adsense --\x3E/igm);
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);}
</script><font size="0"><a href=" http://www.pergola-aluminium.org ">monte escalier</a></font>
</b:if>


ثم قم بإستبدال ما لون باللون الأحمر بكود أدسنس بعد تحويله بالأداة سابقة الذكر.



ملاحظة : الكودين الأزرقين يحققان شرط عدم ظهور الإعلانات في الصفحة الرئيسية وظهورها فقط عند الدخول للمواضيع ،فإذا رغبت بظهور الإعلانات في الصفحة الرئيسية ، قم بحذفهما



فلقد قمت بزيادة تعديل بسيط على الكود و ذلك لمن يريد اظهار اعلانات جوجل ادسنس في جانب نص الموضوع ،سواء على اليمين،وسط،اواليسار كما هو ظاهر في الصورة .




وللقيام بهذا التعديل قم بتبديل الكلمة ذات اللون الأخضر clear:both باحد الكلمات التالية:

float:left : لعرض الاعلان في يسار الموضوع

float:right : لعرض الاعلان في يمين الموضوع

float:center : لعرض الاعلان في وسط الموضوع



والآن كيف يتم إدراج إعلانات جوجل أدسنس في أي مكان داخل المقال ؟ الجواب بسيط جدا ،ما عليك سوى لصق الكود التالي في المكان المراد ظهور فيه الإعلان عند كتابتك أو إنتهائك من كتابة مقال في مدونتك;

ملاحظة : إذا لم تقم باضافة هذا الكود في التدوينة سوف يتم عرض اعلانات جوجل ادسنس تحت عنوان التدوينة تلقائيا.





<!-- adsense -->
تابع القراءة Résuméabuiyad

أخر التعليقات

جميع الحقوق محفوظة 2015 | أعلن معنا | رخصة الإستخدام والنشر | خريطة الموقع | سياسة الخصوصية |