الحلقة 3 : تعديل قالب بلوجر

تعديل قالب بلوجر

تعديل قالب بلوجر

القالب الأول

القالب الثاني

إضافة كود تابعنا على الفايسبوك

قم بتغير رابط صفحة الخبير على الفايسبوك إلى رابط صفحتك

إضافة التعليقات الفيسبوك على مدونة بلوجر

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

إبحث عن <html بعد إيجاده تقول بوضع هذا
الكود xmlns:fb='http://www.facebook.com/2008/fbml'

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

إبحث عن <body> وقم بوضع هذا الكود مباشرة

<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
    FB.init({xfbml: true, appId: معرف التطبيق });
  };
  (function() {
    var e = document.createElement('script'); e.async = true;
    e.src = document.location.protocol +
      '//connect.facebook.net/ar_AR/all.js'
    document.getElementById('fb-root').appendChild(e);
  }());
</script>

وقم بتغير معرف التطبيق إلى App ID الخاص بك على الفايسوبك

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

إبحث عن </head> قم بإضافة هذا الكود قبله

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta   expr:content='data:blog.pageTitle' property='og:title'/>
<meta   expr:content='data:blog.url' property='og:url'/>
<b:else/>
<meta   expr:content='data:blog.title' property='og:title'/>
<meta   expr:content='data:blog.homepageUrl' property='og:url'/>
</b:if>
<meta   content='عنوان المدونة' property='og:site_name'/>
<meta   content='http://google.com/help/hc/images/logos/blogger_logo.gif'   property='og:image'/>
<meta content='معرف التطبيق ID'   property='fb:app_id'/>
<meta content='معرف حسابك على فيسبوك ID'   property='fb:admins'/>
<meta content='article'   property='og:type'/>

قم بتغير الثالي :
عنوان المدونة إلى إسم مدونتك
معرف التطبيق إلى App ID
معرف حسابك على فيسبوك تقوم بدخول إلى هذا الموقع http://findmyfacebookid.com/ وتنسخ رابط بروفايلك ويعطيك هو معرف حسابك على فيسبوك

الخطوة الرابعة :

إبحث عن <data:post.body/> تم أضفه مباشرة في الأسفل

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div><script src='http://connect.facebook.net/ar_AR/all.js#xfbml=1'/>
<fb:comments width='600' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' migrated='1'/>
</div>
</b:if>

ويمكنك أن تغير width='600' إلى القيمة التي تناسب مدونتك.

عمل رابط تغذيه للمدونة بموقع feedburner

الشرح في الفديو

رابط FeedBurner

ملحوضة :

إذا ضهرت لك هذه الصور قم بإضافة رابط تغذية مدونتك وليس الصفحة الرئيسية

مثل لو كانت صفحتك http://www.el5abir.com سوف تقول بإضافة هذه الكتابة feeds/posts/default?alt=rss لكي تصبح هكذا http://www.el5abir.com/feeds/posts/default?alt=rss

إضافة احصل يوميا على تحديتاث المدونة

<div class="widget-content">
<div class="widget-content"> <center><div class="sub"> <h5>ضع إيميلك ليصلك كل جديد المدونة</h5> <div class="ins"> <div id="sleek-subscribe"> <form action="الخبير" '="" class="signform" method="post" target="_new"> <input class="txt2" name="email" onblur="if (this.value == &#39;&#39;) {this.value = &#39;ضع اميلك هنا&#39;;}" onfocus="if (this.value == &#39;ضع اميلك هنا&#39;) {this.value = &#39;&#39;;}" value="ضع اميلك هنا" /> <input class="btn2" type="submit" value=" " /> </form> </div> </div> </div> <style>.sub{width:300px;height:130px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizTgYo_EOXjAMTr8mjIzCoAKiHR7UbLTkywyBe7rDl_QpELlERESHBFHH3nkz0JPYisPuxUrf7pQATCC0_xeQ9vQEY4KcBG-JcY3nz0jA7LYhwe0nenXKQEZSuW5TNH2Ll_WnM6gxRlyA/s1600/Cadre.png);}.sub h5{color:#2d2d2d;font:22px arial;margin:0;padding:25px 0 0 0;text-align:center;}.sub .ins{width:261px;height:35px;margin:12px auto 0;}.sub .ins .txt2{border:1px solid #E1E1E1;background:white;font:12px Tahoma,Geneva,sans-serif;color:silver;padding:10px 7px 9px 7px;margin:0px;float:right;text-align:right;width:136px;}.sub .ins .btn2{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6ChyphenhyphenkbOCXQ10hF4QY4yo5dZVMFCx6Gc-jc0rOEAaWh79a2V-aol-0PFQ4Zy0SR3jcW_fyqpqr2HeCnWK1nnAITdMg9cSHliTLv7TsCo49OiVWv1s48uxcub0423GhxWdiJXzqxIXGjBY/s1600/send.png);float:left;border:none;width:104px;height:33px;cursor:pointer;margin-top:1px;}</style></center> </div> <div class="clear"></div> <span class="widget-item-control"> <span class="item-control blog-admin"> <a class="quickedit" href="//www.blogger.com/rearrange?blogID=4333142131555820750&amp;widgetType=HTML&amp;widgetId=HTML1&amp;action=editWidget&amp;sectionId=sidebar-left-1" onclick="return _WidgetManager._PopupConfig(document.getElementById(&quot;HTML1&quot;));" target="configHTML1" title="تحرير"> <img alt="" height="18" src="http://img1.blogblog.com/img/icon18_wrench_allbkg.png" width="18" /> </a> </span></span>
</div>
<h3></h3>

تقوم بتغير الخبير إلى قائمت Email Subscriptions

إضافة كود تبادل الإعلاني

<style>
#advertise{
  margin: auto;
}
 .adss { list-style:none; margin-top:3px auto; margin: 0 1px 2px 1px; display:inline-block; text-align: center; }
 .adss a { display:block; width:75px; height:75px; padding-right:0px; padding-top: 3px; position:relative; text-decoration:none; }
 .adss a strong { font-weight:normal; position:absolute; left:20px; top:-1px; color:#fff; padding:5px; z-index:9999; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75); background-color:rgba(0, 0, 0, 0.7); -moz-border-radius:3px; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-border-radius:3px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius:3px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);}
 .adss img { max-height: 75px; max-width: 75px; }
 #adsanime:hover { opacity:0.2; }
 #adsanime a strong {
    -webkit-transition-property: opacity;
     -webkit-transition-duration: 500ms;
     -moz-transition-property: opacity;
      -moz-transition-duration: 500ms; }
 #adsanime a strong {
   opacity:0;
    -webkit-transition-property: opacity, top;
     -webkit-transition-duration: 300ms;
      -moz-transition-property: opacity, top;
       -moz-transition-duration: 300ms; }
 #adsanime {
    opacity:0.5;
     -webkit-transition-property: opacity, top;
      -webkit-transition-duration: 300ms;
       -moz-transition-property: opacity, top;
        -moz-transition-duration: 300ms; }
 #adsanime:hover { opacity:1; }
 #adsanime:hover a strong { opacity:1; top:-10px; }
</style>
<center>
<div class="adss" id="adsanime">
<a href="http://el5abir.blogspot.com/">
   <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLc-2EnXgXBzQtvkwcgHdYj5xHFfK9a49ObZQtrPzJuOJyUtu1kw3vWj1AXVCW8OE3XdKVhT-5V_aa4M8yqH7wq51mdxCMmAHqKHYN-OC4o6H8abyUp1czK-BhLX1ZZHSvZ8LN3R7x3i1m/s1600/adschange_125-125.jpg" />
   <strong>أعلن هنا</strong></a>
    </div>
<div class="adss" id="adsanime">
<a href="http://el5abir.blogspot.com/">
   <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLc-2EnXgXBzQtvkwcgHdYj5xHFfK9a49ObZQtrPzJuOJyUtu1kw3vWj1AXVCW8OE3XdKVhT-5V_aa4M8yqH7wq51mdxCMmAHqKHYN-OC4o6H8abyUp1czK-BhLX1ZZHSvZ8LN3R7x3i1m/s1600/adschange_125-125.jpg" />
   <strong>أعلن هنا</strong></a>
    </div>
<div class="adss" id="adsanime">
<a href="http://el5abir.blogspot.com/">
   <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLc-2EnXgXBzQtvkwcgHdYj5xHFfK9a49ObZQtrPzJuOJyUtu1kw3vWj1AXVCW8OE3XdKVhT-5V_aa4M8yqH7wq51mdxCMmAHqKHYN-OC4o6H8abyUp1czK-BhLX1ZZHSvZ8LN3R7x3i1m/s1600/adschange_125-125.jpg" />
   <strong>أعلن هنا</strong></a>
    </div>
<div class="adss" id="adsanime">
<a href="http://el5abir.blogspot.com/">
   <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLc-2EnXgXBzQtvkwcgHdYj5xHFfK9a49ObZQtrPzJuOJyUtu1kw3vWj1AXVCW8OE3XdKVhT-5V_aa4M8yqH7wq51mdxCMmAHqKHYN-OC4o6H8abyUp1czK-BhLX1ZZHSvZ8LN3R7x3i1m/s1600/adschange_125-125.jpg" />
   <strong>أعلن هنا</strong></a>
    </div>
<div class="adss" id="adsanime">
<a href="http://el5abir.blogspot.com/">
   <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLc-2EnXgXBzQtvkwcgHdYj5xHFfK9a49ObZQtrPzJuOJyUtu1kw3vWj1AXVCW8OE3XdKVhT-5V_aa4M8yqH7wq51mdxCMmAHqKHYN-OC4o6H8abyUp1czK-BhLX1ZZHSvZ8LN3R7x3i1m/s1600/adschange_125-125.jpg" />
   <strong>أعلن هنا</strong></a>
    </div>
<div class="adss" id="adsanime">
<a href="http://el5abir.blogspot.com/">
   <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLc-2EnXgXBzQtvkwcgHdYj5xHFfK9a49ObZQtrPzJuOJyUtu1kw3vWj1AXVCW8OE3XdKVhT-5V_aa4M8yqH7wq51mdxCMmAHqKHYN-OC4o6H8abyUp1czK-BhLX1ZZHSvZ8LN3R7x3i1m/s1600/adschange_125-125.jpg" />
   <strong>أعلن هنا</strong></a>
    </div>
<div class="adss" id="adsanime">
<a href="http://el5abir.blogspot.com/">
   <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLc-2EnXgXBzQtvkwcgHdYj5xHFfK9a49ObZQtrPzJuOJyUtu1kw3vWj1AXVCW8OE3XdKVhT-5V_aa4M8yqH7wq51mdxCMmAHqKHYN-OC4o6H8abyUp1czK-BhLX1ZZHSvZ8LN3R7x3i1m/s1600/adschange_125-125.jpg" />
   <strong>أعلن هنا</strong></a>
    </div>
</center>
<a href="http://el5abir.blogspot.com/"></a>

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

مواضيع ذات صلة