الخبراء العرب: بلوجر

‏إظهار الرسائل ذات التسميات بلوجر. إظهار كافة الرسائل

الثلاثاء، 5 يناير 2016

إضافة أزرار (متجاوبة) لمشاركة الموضوع في مواقع التواصل الإجتماعي إلى مدونة بلوغر ( واتساب ، فيسبوك ، غوغل+ ، تويتر... )

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

أولا

نتجه إلى قالب > تحرير HTML

ثانيا

ننقر في أي مكان داخل محرر ال HTML ثم نضغط Ctrl + F

نبحث عن:

</head>

ثالثا

فوقها مباشرة نلصق الكود css التالي الذي سيقوم بتنسيق مظهر أزرارنا و الذي سيعطيها الأبعاد المناسبة تبعا لمقاس الشاشة:

<b:if cond='data:blog.pageType == "item"'>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet" /><style type='text/css'>
.share-text{display:none!important}.sharebar{height:28px;background:#F7F7F7;border-top:1px solid #EAEAEA;position:relative;z-index:2;width:100%;display:inline-block;clear:both;margin:10px -20px -6px;padding:10px 0 0 36px}.sharebar .Share_buttons{display:block;margin:0 auto}.sharebar .Share_buttons .wrap{text-align:center;margin:0 auto;display:inline-block;min-width:41px}.sharebar .Share_buttons .wrap1{display:inline-block;width:31px;float:left}.sharebar .Share_buttons ul{margin:0;padding:0}.sharebar .Share_buttons ul li a,.sharebar .Share_buttons ul li a:hover{color:#FFF!important;cursor:pointer;line-height:25px;height:100%;display:block;text-decoration:none}.sharebar .Share_buttons ul li{list-style:none;padding:0;margin:-4px 1px;float:left;width:16%;max-width:100px;display:inline-block;font-size:13px;overflow:hidden;height:25px;line-height:25px;color:#fff;border:1px solid rgba(0,0,0,.04);-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;transition:all .4s ease-in-out}.sharebar .Share_buttons ul li .fa{color:#fff;font-size:17px;font-weight:400;font-family:FontAwesome;display:inline-block;text-align:center;padding:0;height:25px;line-height:inherit;width:30px;background-color:rgba(0,0,0,.1);border-right:1px solid rgba(0,0,0,.05)}.sharebar .Share_buttons .btn_whtspp{background-color:#5CBE4A}.sharebar .Share_buttons .btn_whtspp:hover{background-color:#53AB43}.sharebar .Share_buttons .btn_fb{background:#3a579a}.sharebar .Share_buttons .btn_fb:hover{background:#314a83}.sharebar .Share_buttons .btn_twtr{background:#00abf0}.sharebar .Share_buttons .btn_twtr:hover{background:#0092cc}.sharebar .Share_buttons .btn_gplus{background:#df4a32}.sharebar .Share_buttons .btn_gplus:hover{background:#be3f2b}.sharebar .Share_buttons .btn_linkdin{background:#0077b5}.sharebar .Share_buttons .btn_linkdin:hover{background:#005480}.sharebar .Share_buttons .share.h6{font-size:10px;font-weight:700;text-shadow:none!important;text-decoration:none;text-align:center;color:#000;border-top:3px solid #FFF600!important;border-bottom:0;padding:5px 0 0!important;margin:0!important;line-height:8px;border-radius:75% 0}.sharebar .Share_buttons .share{border:none;margin:0 5px 0 1px;overflow:visible!important;width:95px!important}.sharebar .Share_buttons .share .count.h4{font-size:18px;font-weight:700;text-shadow:none;text-decoration:none;font-family:sans-serif;text-align:center;color:red;line-height:15px;margin:-4px 0 2px;min-height:15px;padding:0;border:none}.sharebar .Share_buttons .btn_fb .share-btn,.sharebar .Share_buttons .btn_gplus .share-btn,.sharebar .Share_buttons .btn_linkdin .share-btn,.sharebar .Share_buttons .btn_twtr .share-btn,.sharebar .Share_buttons .btn_whtspp .share-btn{position:relative;color:#C3C3C3;display:inline-block;text-align:center;font-weight:700;font-size:11px;float:right;min-width:12px;font-family:sans-serif;padding:0 5px;background-color:rgba(0,0,0,.28);border-radius:0 0 0 15px}@media only screen and (max-width:979px){.sharebar .Share_buttons .btn_linkdin{width:34px}.sharebar .Share_buttons .btn_fb,.sharebar .Share_buttons .btn_gplus,.sharebar .Share_buttons .btn_twtr,.sharebar .Share_buttons .btn_whtspp{width:78px}.sharebar .Share_buttons .btn_fb .share-btn,.sharebar .Share_buttons .btn_gplus .share-btn,.sharebar .Share_buttons .btn_linkdin .share-btn,.sharebar .Share_buttons .btn_twtr .share-btn,.sharebar .Share_buttons .btn_whtspp .share-btn{display:none!important}}@media only screen and (max-width:768px){.sharebar .Share_buttons ul li a,.sharebar .Share_buttons ul li a:hover{color:#FFF!important;cursor:pointer;line-height:25px;font-size:11px;height:100%;display:block;text-decoration:none}.sharebar .Share_buttons .wrap{min-width:34px}.sharebar .Share_buttons .btn_linkdin,.sharebar .Share_buttons .btn_twtr{width:30px}.sharebar .Share_buttons ul li{margin:1px 3px}.sharebar .Share_buttons{margin:-4px auto 0}}@media only screen and (max-width:479px){.sharebar .Share_buttons .share{border:none;margin:0 5px 0 1px;overflow:visible!important;width:80px!important}.sharebar .Share_buttons ul li{width:25px!important;margin:2px;border-radius:50px;border:2px solid rgba(0,0,0,.14)}.sharebar .Share_buttons ul li .fa{width:34px!important}.sharebar{height:28px;display:inline-block;clear:both;margin-right:-14px;padding:10px 0 10px 36px}.sharebar .Share_buttons{display:inline-block;float:left;margin-top:-4px}.sharebar .Share_buttons .btn_fb,.sharebar .Share_buttons .btn_whtspp{width:78px!important}}
</style>
</b:if>

رابعا

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

<data:post.body/>

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

<b:if cond='data:blog.pageType == "item"'> <b:if cond='data:blog.pageType != "static_page"'> <div class='sharebar'> <div class='Share_buttons'> <ul> <li class='btn_linkdin'> <a expr:href='" http://www.linkedin.com/shareArticle?mini=true& url=" + data:post.url + " & title=" + data:post.title + " & summary=& source=" ' onclick='window.open(this.href," sharer" ," toolbar=0,status=0,width=626,height=500" ); return false;' rel='nofollow'> <div class='wrap1'> <i class='fa fa-linkedin'/> </div> <div class='wrap'> شارك </div> <div class='share-btn' data-service='linkedin'> <div class='count'/> </div> </a> </li> <li class='btn_twtr'> <a expr:href='"https://twitter.com/intent/tweet?url=" + data:blog.url + "&text=" + data:post.title + ""' onclick='window.open(this.href," sharer" ," toolbar=0,status=0,width=626,height=436" ); return false;' rel='nofollow'> <div class='wrap1'> <i class='fa fa-twitter'/> </div> <div class='wrap'> غرد </div> <div class='share-btn' data-service='twitter'> <div class='count'/> </div> </a> </li> <li class='btn_gplus'> <a expr:href='"http://plus.google.com/share?url=" + data:blog.url' onclick='javascript:window.open(this.href," " ," menubar=no,toolbar=no,resizbutton_le=yes,scrollbars=yes,height=600,width=600" ); return false; ' rel='nofollow'> <div class='wrap1'> <i class='fa fa-google-plus'/> </div> <div class='wrap'> شارك </div> <div class='share-btn' data-service='google'> <div class='count'/> </div> </a> </li> <li class='btn_fb'> <a expr:href='" http://www.facebook.com/share.php?v=4& src=bm& u=" + data:post.url + " & t=" + data:post.title' onclick='window.open(this.href," sharer" ," toolbar=0,status=0,width=626,height=436" ); return false;' rel='nofollow'> <div class='wrap1'> <i class='fa fa-facebook'/> </div> <div class='wrap'> شارك </div> <div class='share-btn' data-service='facebook'> <div class='count'/> </div> </a> </li> <li class='btn_whtspp'> <a alt='WhatsApp' data-action='share/whatsapp/share' expr:href='" whatsapp://send?text=" + data:post.title + " !-" + data:post.url' id='whatsapp-share-button' onclick='window.open(this.href," sharer" ," toolbar=0,status=0,width=626,height=436" ); return false;' rel='nofollow'> <div class='wrap1'> <i class='fa fa-whatsapp'/> </div> <div class='wrap'> أرسل </div> </a> </li> </ul> </div> </div> </b:if></b:if>

خامسا

نقوم بحفظ القالب و نتأكد من نجاح ما قمنا به.

هنيئا.

دعواتكم.

تم تعديل هذه التدوينة مرة واحدة 05/01/2016 لتصحيح خطا.

الاثنين، 4 يناير 2016

غير معرف 17:22

طريقة إضافة صندوق الإعجاب - بصفحة الفيسبوك - المنبثق إلى مدونتك أو موقعك

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

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

للقيام بهذا الأمر ما علينا إلا اتباع الخطوات القليلة التالية:

فيما يخص الموقع

1 - إن لم نكن نستعمل jQuery في موقعنا فيجب إضافة السطر التالي مباشرة بعد <head> :

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>

2 - ثم مباشرة قبل </head> نضيف ما يلي:

<style>#fbox-background,#fbox-close{width:100%;height:100%}#fbox-background{display:none;background:rgba(245,245,245,.9);position:fixed;top:0;left:0;z-index:99999}#fbox-main{width:340px;min-height:200px;background:#eaeaea;border:4px solid #01B1D3;position:absolute;top:32%;left:37%;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-moz-box-shadow:5px 5px 12px 0 #656565;-webkit-box-shadow:5px 5px 12px 0 #656565;-o-box-shadow:5px 5px 12px 0 #656565;box-shadow:5px 5px 12px 0 #656565;filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=12)}#fbox-button{float:left;cursor:pointer;position:absolute;left:0;top:0;z-index:100}#fbox-button:before{content:"X";padding:4px 8px;background:#01B1D3;color:#eaeaea;font-weight:700;font-size:13px;font-family:Tahoma}</style>

3 - و أخيرا نضيف الكود التالي مباشرة قبل </body> :

<script type='text/javascript'>
jQuery.cookie=function(key,value,options){if(arguments.length>1&&String(value)!=="[object Object]"){options=jQuery.extend({},options);if(value===null||value===undefined){options.expires=-1;}
if(typeof options.expires==='number'){var days=options.expires,t=options.expires=new Date();t.setDate(t.getDate()+days);}
value=String(value);return(document.cookie=[encodeURIComponent(key),'=',options.raw?value:encodeURIComponent(value),options.expires?'; expires='+options.expires.toUTCString():'',options.path?'; path='+options.path:'',options.domain?'; domain='+options.domain:'',options.secure?'; secure':''].join(''));}
options=value||{};var result,decode=options.raw?function(s){return s;}:decodeURIComponent;return(result=new RegExp('(?:^|; )'+encodeURIComponent(key)+'=([^;]*)').exec(document.cookie))?decode(result[1]):null;};>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_facebook_box') != 'yes'){
$('#fbox-background').delay(500).fadeIn('slow');
$('#fbox-button, #fbox-close').click(function(){
$('#fbox-background').stop().fadeOut('medium');
});
$('#fbox-background').delay(13000).fadeOut('slow');
}
$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });});
</script>
<div id='fbox-background'>
<div id='fbox-close'>
</div>
<div id='fbox-main'>
<div id='fbox-button'>
</div>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/ar_AR/sdk.js#xfbml=1&version=v2.5&appId=521085524588635";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-page" data-href="https://www.facebook.com/arexperts" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/arexperts"><a href="https://www.facebook.com/arexperts">‎الخبراء العرب‎</a></blockquote></div></div>
</div>
</div>

4- لا ننسا أن نغير ما هو مكتوب بالأحمر إلى عنوان صفحتنا و إلى إسمها.
ثم يمكن أن نغير المدة التي تبقى فيها النويفذة منبثقة قبل أن تختفي و ذلك بتغيير ما هو مكتوب بالبرتقالي. 13000 تعني 13 ثواني، 10000 = 10 ثواني، و هكذا.
و إن رغبنا أن تظهر النويفذة في كل زيارة جديدة لنفس الزائر نقوم بحذف السطر الذي بالأخضر.

فيما يخص مدونة بلوغر

1- نذهب إلى التخطيط > الشريط الجانبي > إضافة أداة > نختار HTML/JavaScript .

2- ثم في المحتوى نلصق ما يلي:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
<style>
#fbox-background,#fbox-close{width:100%;height:100%}#fbox-background{display:none;background:rgba(245,245,245,.9);position:fixed;top:0;left:0;z-index:99999}#fbox-main{width:340px;min-height:200px;background:#eaeaea;border:4px solid #01B1D3;position:absolute;top:32%;left:37%;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-moz-box-shadow:5px 5px 12px 0 #656565;-webkit-box-shadow:5px 5px 12px 0 #656565;-o-box-shadow:5px 5px 12px 0 #656565;box-shadow:5px 5px 12px 0 #656565;filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=12)}#fbox-button{float:left;cursor:pointer;position:absolute;left:0;top:0;z-index:100}#fbox-button:before{content:"X";padding:4px 8px;background:#01B1D3;color:#eaeaea;font-weight:700;font-size:13px;font-family:Tahoma}
</style>
<script type='text/javascript'>
//<![CDATA[
jQuery.cookie=function(key,value,options){if(arguments.length>1&&String(value)!=="[object Object]"){options=jQuery.extend({},options);if(value===null||value===undefined){options.expires=-1;}
if(typeof options.expires==='number'){var days=options.expires,t=options.expires=new Date();t.setDate(t.getDate()+days);}
value=String(value);return(document.cookie=[encodeURIComponent(key),'=',options.raw?value:encodeURIComponent(value),options.expires?'; expires='+options.expires.toUTCString():'',options.path?'; path='+options.path:'',options.domain?'; domain='+options.domain:'',options.secure?'; secure':''].join(''));}
options=value||{};var result,decode=options.raw?function(s){return s;}:decodeURIComponent;return(result=new RegExp('(?:^|; )'+encodeURIComponent(key)+'=([^;]*)').exec(document.cookie))?decode(result[1]):null;};//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_facebook_box') != 'yes'){
$('#fbox-background').delay(500).fadeIn('slow');
$('#fbox-button, #fbox-close').click(function(){
$('#fbox-background').stop().fadeOut('medium');
});
$('#fbox-background').delay(13000).fadeOut('slow');
}
$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });});
</script>
<div id='fbox-background'>
<div id='fbox-close'>
</div>
<div id='fbox-main'>
<div id='fbox-button'>
</div>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/ar_AR/sdk.js#xfbml=1&version=v2.5&appId=521085524588635";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-page" data-href="https://www.facebook.com/arexperts" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/arexperts"><a href="https://www.facebook.com/arexperts">‎الخبراء العرب‎</a></blockquote></div></div>
</div>
</div>

إن كنا نستعمل jQuery سلفا يجب أن نحذف السطر الأول من الكود أعلاه لتفادي أي مشاكل:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>

3- طالع الخطوة الرابعة أعلاه.

4- ثم ننقر "حفظ"، و بعده ننقر "حفظ الترتيب" (في الأعلى) .

أتمنى أن تستفيدوا من هذه التدوينة.
في انتظار تعاليقكم ، تقبلوا فائق احترامي.

الأحد، 3 يناير 2016

غير معرف 17:44

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

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

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

إذن لكي ندرج هذه الإضافة في مدونتنا ما علينا إلا اتباع الخطوات التالية:

أولا:
نتجه إلى الرابط التالي:
https://developers.facebook.com/docs/plugins/page-plugin

ثانيا:
نعبئ الخانات بما يناسب:

Facebook Page URL: هنا نضع رابط صفحتنا .

Tabs: نجعله فارغنا لأننا نريد فقط "صندوق" الإعجاب و المشاركة.
أما إن كنا نريد إظهار لائحة بأخر مشوراتنا على صفحتنا فنكتب timeline، و إن رغبنا في إظهار "الأحداث" و إعطاء الإمكانية للزوار للإنخراط فيها و تتبعها فيمكن إضافة كلمة events ( بعد فاصلة ).
و يمكننا أيضا إتاحة الفرصة للزوار لإرسال رسائل مباشرة لصفحتنا بإضافة كلمة messages ( بعد ، ) .

Width و Height : نتركهما فارغين لكي نسمح للصندوق باتخاد الأبعاد المناسبة تلقائيا.

و نترك الإعدادات الأخرى كما هي.

ثالثا:

بعدما انتهينا من الإعدادت ننقر زر "أحصل على الكود" Get Code :

- من اللائحة المنسدلة في الأعلى إلى اليمين نختار اللغة العربية،
- ثم نترك هذه الصفحة دون غلقها

رابعا:

ونتوجه إلى صفحة البلوغر، و مباشرة إلى:
التخطيط > الشريط الجانبي > إضافة أداة > نختار HTML/JavaScript .

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

- ثم ننقر "حفظ"، و بعده ننقر "حفظ الترتيب" (في الأعلى) .

هنيئا.

السبت، 2 يناير 2016

غير معرف 21:10

طريقة وضع إعلان أدسانس وسط الموضوع في أي مكان من اختيارك

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

و طريقة فعل ذلك ليست بالصعبة، فما علينا إلا اتباع الخطوات البسيطة التالية.

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

أولا:

يجب أن نعلم أنه لا يمكننا لصق كود إعلانات Adsense مباشرة داخل القالب. بل لا بد من تفكيك ذلك الكود إلى كود نصي يقبله محرك القوالب الخاص بالبلوغر.

للقيام بذلك سننستعمل أداة تفكيك كود أدسنس، ثم ننسخ الكود المحصل عليه.

ثانيا:
سنبحث داخل القالب عن العبارة التالية:

<data:post.body/>

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

ثالثا:
نضيف قبل العبارة السابقة الكود التالي:

<div expr:id='"gg_ads_begin" + data:post.id'></div>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<div style="margin:15px 0;clear:both">
<center>

</center>
</div>
</b:if>
</b:if>
<div expr:id='"gg_ads_end" + data:post.id'>

و بعدها نضيف ما يلي:

</div>
<script type="text/javascript">
var obj0 = document.getElementById("gg_ads_begin<data:post.id/>");
var obj1 = document.getElementById("gg_ads_end<data:post.id/>");
var s = obj1.innerHTML;
var r = s.search(/\x3C!--ggads--\x3E/igm);
if (r > 0) {
obj0.innerHTML = s.substr(0, r);
obj1.innerHTML = s.substr(r + 16);
}
</script>

و لا يجب أن ننسنا أن نعوض ما هو باللون الأحمر أعلاه بكود أدسنس المحصل عليه في الخطوة الأولى.

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

ثم نرجع إلى المحرر النصي المتطور لإكمال تدوينتنا.
ثم نعاين التدوينة لنتأكد من موافقة مكان الإعلان مع ما نريد.

هذا كل ما في الأمر.

هنيئا.

الخميس، 6 فبراير 2014

غير معرف 08:32

كيف أضيف فهرس مواضيع جميل لمدونة بلوجر؟

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

يمكنكم الإطلاع على مثال حي لفهرس مدونة الخبراء العرب هنا.

كيف نقوم إذن بإضافة فهرس لكافة مواضيع المدونة؟

1- نتجه إلى لوحة تحكم مدونة بلوغر ثم "صفحات" و نقوم بإنشاء صفحة جديدة فارغة نسميها blog index

2- نقوم بلصق كل هذا الكود في المحرر بعد أن نكون قد إخترنا التحرير على شكل HTML:

<div dir="rtl" style="text-align: right;" trbidi="on">
<style type="text/css">
#toc{
width:99%;
margin:5px auto;
border:1px solid #2D96DF;
-webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
-moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
}
.labl{
color:#FF5F00;
font-weight:bold;
margin:0 -5px;
padding:1px 11px 2px 0;
background:-moz-linear-gradient(left,#C2EAFE 0%,#055A85 40%);
background:-webkit-gradient(linear,right 10,left 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE));
border:1px solid #2D96DF;
border-radius:4px;-moz-border-radius:4px;
-webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb;
-moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block;
}
.labl a{
color:#fff;
}
.labl:first-letter{t
ext-transform:uppercase;
}
.new{
color:#FF5F00;
font-weight:bold;
font-style:italic;
}
.postname{
font-weight:normal;
background:-moz-linear-gradient(left,#C2EAFE 0%,#fff 40%);
background:-webkit-gradient(linear,right 80,left 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE));
}
.postname li{
border-bottom: #ddd 1px dotted;
margin-right:5px
}

</style>
<script>
//<![CDATA[

eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\b'+e(c)+'\b','g'),k[c]);return p}('2 3=F H();2 u=F H();2 w=F H();2 q=F H();2 6=F H();2 y=F H();2 7="L";2 17=1s;2 27=2P;2 E="";2 1a=0;r 1Q(a){r b(){4("A"1H a.1i){2 d=a.1i.A.v;1a=d;D=0;B(2 h=0;h<d;h++){2 n=a.1i.A[h];2 e=n.O.$t;2 m=n.23.$t.1x(0,10);2 j;B(2 g=0;g<n.M.v;g++){4(n.M[g].18=="2c"){j=n.M[g].s;U}}2 o="";B(2 g=0;g<n.M.v;g++){4(n.M[g].18=="1Z"){o=n.M[g].s;U}}2 c="";4("16"1H n){B(2 g=0;g<n.16.v;g++){c=n.16[g].28;2 f=c.1v(";");4(f!=-1){c=c.1x(0,f)}6[D]=c;3[D]=e;q[D]=m;u[D]=j;w[D]=o;4(h<10){y[D]=13}I{y[D]=1s}D=D+1}}}}}b();7="L";P(7);19();17=13;1r();9.x()}r 1O(a){1F(0,0);E=a;K(E)}r 1n(){19();E="";K(E)}r P(d){r c(e,g){2 f=3[e];3[e]=3[g];3[g]=f;2 f=q[e];q[e]=q[g];q[g]=f;2 f=u[e];u[e]=u[g];u[g]=f;2 f=6[e];6[e]=6[g];6[g]=f;2 f=w[e];w[e]=w[g];w[g]=f;2 f=y[e];y[e]=y[g];y[g]=f}B(2 b=0;b<3.v-1;b++){B(2 a=b+1;a<3.v;a++){4(d=="L"){4(3[b]>3[a]){c(b,a)}}4(d=="15"){4(3[b]<3[a]){c(b,a)}}4(d=="1g"){4(q[b]>q[a]){c(b,a)}}4(d=="R"){4(q[b]<q[a]){c(b,a)}}4(d=="1w"){4(6[b]>6[a]){c(b,a)}}}}}r 19(){7="1w";P(7);2 a=0;2 b=0;S(b<3.v){J=6[b];T=a;1p{a=a+1}S(6[a]==J);b=a;1j(T,a);4(b>3.v){U}}}r 1j(d,c){r e(f,h){2 g=3[f];3[f]=3[h];3[h]=g;2 g=q[f];q[f]=q[h];q[h]=g;2 g=u[f];u[f]=u[h];u[h]=g;2 g=6[f];6[f]=6[h];6[h]=g;2 g=w[f];w[f]=w[h];w[h]=g;2 g=y[f];y[f]=y[h];y[h]=g}B(2 b=d;b<c-1;b++){B(2 a=b+1;a<c;a++){4(3[b]>3[a]){e(b,a)}}}}r K(a){2 l=0;2 h="";2 e="25 Z";2 m="11 12 2p 2s 2A";2 d="2L";2 k="11 12 1I 1J 1K";2 c="1L";2 j="";4(7=="L"){m+=" (1N)";k+=" (14 V)"}4(7=="15"){m+=" (1l)";k+=" (14 V)"}4(7=="1g"){m+=" (1l)";k+=" (14 V)"}4(7=="R"){m+=" (1l)";k+=" (1S V)"}4(E!=""){j="11 12 1Y 31"}h+="<1t>";h+="<N>";h+='<5 8="i-W-1b">';h+='<a s="1c:1o();" O="'+m+'">'+e+"</a>";h+="</5>";h+='<5 8="i-W-1d">';h+='<a s="1c:1q();" O="'+k+'">'+d+"</a>";h+="</5>";h+='<5 8="i-W-1e">';h+='<a s="1c:1n();" O="'+j+'">'+c+"</a>";h+="</5>";h+='<5 8="i-W-1f">';h+="X 1M";h+="</5>";h+="</N>";B(2 g=0;g<3.v;g++){4(a==""){h+='<N><5 8="i-A-1b"><a s="'+u[g]+'">'+3[g]+'</a></5><5 8="i-A-1d">'+q[g]+'</5><5 8="i-A-1e">'+6[g]+'</5><5 8="i-A-1f"><a s="'+w[g]+'">X</a></5></N>';l++}I{z=6[g].1v(a);4(z!=-1){h+='<N><5 8="i-A-1b"><a s="'+u[g]+'">'+3[g]+'</a></5><5 8="i-A-1d">'+q[g]+'</5><5 8="i-A-1e">'+6[g]+'</5><5 8="i-A-1f"><a s="'+w[g]+'">X</a></5></N>';l++}}}h+="</1t>";4(l==3.v){2 f='<C 8="i-1u">1h 1R '+3.v+" Z<G/></C>"}I{2 f='<C 8="i-1u">1h '+l+" 1T 1U 1V '";f+=E+"' 1W "+3.v+" 1X Z<G/></C>"}2 b=9.Y("i");b.1k=f+h}r 1r(){2 a=0;2 b=0;S(b<3.v){J=6[b];9.x("<p/>");9.x('<C 8="20"><a s="/21/22/'+J+'">'+J+"</a></C><1y 8='24'>");T=a;1p{9.x("<1z>");9.x('<a s="'+u[a]+'">'+3[a]+"</a>");4(y[a]==13){9.x(' - <C 8="F">26!</C>')}9.x("</1z>");a=a+1}S(6[a]==J);b=a;9.x("</1y>");1j(T,a);4(b>3.v){U}}}r 1o(){4(7=="L"){7="15"}I{7="L"}P(7);K(E)}r 1q(){4(7=="R"){7="1g"}I{7="R"}P(7);K(E)}r 1A(){4(17){K(E);2 a=9.Y("1B")}I{29("2a 2b... 1C 2d 2e")}}r 2f(){2 a=9.Y("i");a.1k="";2 b=9.Y("1B");b.1k='<a s="#" 2g="1F(0,0); 1A(); 2h.2i(\'i-2j\',\'2k\');">?? 1h 2l 2m</a> <2n 2o="1D://2q.2r.1E/2t.2u"/>'}r 2v(){B(2 a=0;a<1a;a++){9.x("<G>");9.x('2w 2x : <a s="'+u[a]+'">'+3[a]+"</a><G>");9.x('X 2y : <a s="'+w[a]+'">'+3[a]+"</a><G>");9.x("<G>")}};9.x("<C 2z='Q-2B:2C;2D:2E;Q-2F:2G;2H:2I 2J 0 0;'><a O='2K 1C 1G 2M 2N - 2O 1G 1m.2Q.2R' s='1D://1m.2S-2T.1E' 2U='2V' 18='2W'><Q 2X='#2Y'>2Z 30 1P!</Q></a></C>");',62,188,'||var|postTitle|if|td|postLabels|sortBy|class|document|||||||||toc||||||||postDate|function|href||postUrl|length|postMp3|write|postBaru||entry|for|span|ii|postFilter|new|br|Array|else|temp1|displayToc|titleasc|link|tr|title|sortPosts|font|datenewest|while|firsti|break|first|header|Download|getElementById|Artikel||Klik|untuk|true|newest|titledesc|category|tocLoaded|rel|sortlabel|numberfeed|col1|javascript|col2|col3|col4|dateoldest|Menampilkan|feed|sortPosts2|innerHTML|ascending|www|allPosts|toggleTitleSort|do|toggleDateSort|displayToc2|false|table|note|lastIndexOf|orderlabel|substring|ol|li|showToc|toclink|TOC|http|com|scroll|by|in|Sortir|bedasarkan|tanggal|Kategori|MP3|descending|filterPosts|widget|loadtoc|Semua|oldest|artikel|dengan|kategori|dari|Total|menampilkan|enclosure|labl|search|label|published|postname|Judul|جديد|numChars|term|alert|Just|wait|alternate|is|loading|hideToc|onclick|Effect|toggle|result|blind|Daftar|Isi|img|src|sortir|radiorodja|googlepages|berdasarkan|new_1|gif|looptemp2|Post|Link|mp3|style|judul|size|0px|float|right|family|arial|margin|20px|5px|Blogger|Tanggal|Abu|Farhan|Style|250|intert3chmedia|net|abu|farhan|target|_blank|nofollow|color|ff5f00|Grab|this|semua'.split('|'),0,{}))
//]]>
</script>
<br />
<div id="toc">
<script src="/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script></div>
</div>

٣- في الشريط الجانبي ننقر على إختيارات ثم Don't allow لإخفاء صندوق التعاليق.

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

٥- نذهب الأن إلى تومبلايت ثم "تحرير HTML" لإضافة رابط الفهرس حيث نشاء:

<a href='/p/blog-index.html'>فهرس الموقع</a>

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

إن كانت لكم أي إستفسارات يسرني أن أجيب عنها.
في حفظ الله

الأربعاء، 5 فبراير 2014

غير معرف 11:18

كيف تقوم بإخفاء الشريط الجانبي Sidebar في صفحات معينة في مدونة البلوجر

على مدونة بلوجر يظهر الشريط الجانبي Sidebar في جميع الصفحات، إلا أنه قد تحتاج لتخصيص بعض من هذه الأخيرة بإخفاء ذلك الشريط بِرُمَّته، في صفحات لا تحتاج إليه، كصفحات الإتصال أو شروط الإستعمال أو سياسة الخصوصية. أما إن كنت تريد فقط إخفاء بعض الإضافات التي توجد في السايدبار فيمكنك الإطلاع على هذه التدوينة.

إذن لكي نقوم بهذه المهمة إتبع معنا الخطوات البسيطة التالية.

1- أولا سنذهب إلى لوحة تحكم البلوجر ثم نتجه إلى Template و نختار Edit HTML

2- الأن سنبحث عن السايدبار في التومبلايت .
من أجل ذلك ننقر داخل محرر الكود الذي أمامنا ثم نضغطا تباعا و في نفس الوقت على Ctrl و F، فيظهر شريط البحث في الركن العلوي الأيمن لمحرر الكود، فنقوم بكتابة

و نضغط "إدخال" في لوحة المفاتيح، فيأخدنا إلى كود السايدبار

3- فوق aside> نظيف مايلي:

إن كنا نريد إخفاءها في جميع الصفحات الثابتة

<b:if cond='data:blog.pageType != "static_page"'>

إن كنا نريد إخفاءها في صفحة معينة:

<b:if cond='data:blog.url != "URL of the page"'>

إن كنا نريد إخفاءها على كل الصفحات إلا الصفحة الرئيسة فنظيف التالي:

<b:if cond='data:blog.url == data:blog.homepageUrl'>

لإخفائها في صفحة الأرشيف:

<b:if cond='data:blog.pageType != "archive"'>

4- نبحث الأن عن

</aside

و أسفلها نظيف

</b:if>

5- نقوم بحفظ التومبلايت.

مشكورين على تتبعكم، إن واجهتكم مشكلة في تنفيذ الخطوات السالفة ضعوها في تعليق
في أمان الله

الثلاثاء، 4 فبراير 2014

غير معرف 12:09

كيف تقوم بإخفاء الإضافات widgets من الصفحات الثابتة static pages في مدونة البلوجر

كما لابد و أنكم لاحظتم فإضافات الويدجيتس تظهر في جميع صفحات مدونة البلوجر. لكن ذلك غير مناسب لمن يستعمل خدمات AdSense، لأن حسابه قد يتم توقيفه إن قام بعرض إعلانات غوغل على صفحات الإتصال أو شروط الإستعمال أو سياسة الخصوصية. لذلك فقد يصبح من الظروري علينا إخفاؤها في تلك الصفحات. ومن أجل فسنستعمل تاغات الشروط conditional tags.

1- و أول شيء سنفعله هو الذهاب إلى لوحة تحكم البلوجر ثم نتجه إلى Layout لتحديد الإضافات التي نريد حجبها فننقر على Edit و نقوم بنسخ إسمها و حفظه على محرر نصوص.

2- نذهب الأن إلى Template و نختار Edit HTML

3- الأن سنبحث عن الويدجيت الذي نريد إخفاءه مثلا "تابعونا عبر الفيسبوك".
من أجل ذلك ننقر داخل محرر الكود الذي أمامنا ثم نضغطا تباعا و في نفس الوقت على Ctrl و F، فيظهر شريط البحث في الركن العلوي الأيمن لمحرر الكود، فنقوم بلصق إسم الويدجيت و نضغط "إدخال" في لوحة المفاتيح، فيأخدنا إلى كود الويدجيت

4- ننقر الأن على السهم المتواجد يسار الكود ليتم عرضه كاملا

ثم مرة ثانية ننقر على السهم الجديد الذي ظهر

كود الويدجيت كاملا هو هذا:

<b:widget id='HTML1' locked='false' title='تابعونا عبر الفيسبوك' type='HTML'>
                 <b:includable id='main'>

<b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
    <data:content/>
</div>

<b:include name='quickedit'/>
</b:includable>
               </b:widget>

5- بعدما وجدنا الكود نقوم بإضافة السطور المكتوبة باللون الأحمر حسب الحاجة. فمثلا:

لإخفاء الويدجيت في جميع الصفحات الثابتة:

<b:widget id='HTML1' locked='false' title='تابعونا عبر الفيسبوك' type='HTML'>
                 <b:includable id='main'>
<b:if cond='data:blog.pageType != "static_page"'>


<b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
    <data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
               </b:widget>

لإخفاء الإضافة في صفحة معينة:

<b:widget id='HTML1' locked='false' title='تابعونا عبر الفيسبوك' type='HTML'>
                 <b:includable id='main'>
<b:if cond='data:blog.url != "هنا تكتب رابط الصفحة"'>

<b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
    <data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
               </b:widget>

٦- و نكرر العملية مع جميع الإضافات التي نرغب في إخفائها ثم نقوم بحفظ التومبلايت.

أرجو ألا أكون قد أغفلت شيء في الموضوع، شكرا لتتبعكم

الاثنين، 3 فبراير 2014

غير معرف 14:57

كيف تضيف نموذج أو صفحة الإتصال "إتصل بنا" لمدونة بلوجر؟

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

إذن إذا كنت ترغب في وضع صفحة "إتصل بنا" إتَّبع معنا الخطوات التالية:

1- نذهب إلى لوحة تحكم البلوج ثم Layout ثم ننقر على Add a gadget (المتواجدة في الشريط الجانبي مثلا) ثم في النافذة المنبثقة نختار More gadgets فَ Contact Form بالنقر على علامة + ثم ننقر حفظ Save في الصفحة التي ستظهر.

2- يمكنك التوقف هنا إن كنت تريد وضع إستمارة الإتصال في الشريط الجانبي. أما إن كنت تريد أن تُفرِد لها صفحة خاصة فتابع الخطوات التالية.

3- سنقوم في هذه الخطوة بحذف جل الكود الذي تم إضافته بعد إحداثنا لنموذج الإتصال:
إذن نذهب إلى Template ثم Edit HTML و نبحث عن

id='ContactForm1'

ملاحظة: لإظهار شريط البحث ننقر داخل محرر الكود ثم نضغط في لوحة المفاتيح تباعا وفي نفس الوقت على Ctrl و F ثم نكتب ما نبحث عنه و نضغط "إدخال".

4- ننقر أولا على السهم الذي تشاهدونه لعرض كامل الكود، و بعد ذلك ننقر ثانية على السهم الذي سيظهر مباشرة أسفل الأول.

ثم

5- نقوم بحذف كل الكود التالي:

<b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
</b:if>
<div class='contact-form-widget'>
    <div class='form'>
      <form name='contact-form'>
        <p/>
        <data:contactFormNameMsg/>
        <br/>
        <input class='contact-form-name' expr:id='data:widget.instanceId + "_contact-form-name"' name='name' size='30' type='text' value=''/>
        <p/>
        <data:contactFormEmailMsg/> <span style='font-weight: bolder;'>*</span>
        <br/>
        <input class='contact-form-email' expr:id='data:widget.instanceId + "_contact-form-email"' name='email' size='30' type='text' value=''/>
        <p/>
        <data:contactFormMessageMsg/> <span style='font-weight: bolder;'>*</span>
        <br/>
        <textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + "_contact-form-email-message"' name='email-message' rows='5'/>
        <p/>
        <input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + "_contact-form-submit"' expr:value='data:contactFormSendMsg' type='button'/>
        <p/>
        <div style='text-align: center; max-width: 222px; width: 100%'>
          <p class='contact-form-error-message' expr:id='data:widget.instanceId + "_contact-form-error-message"'/>
          <p class='contact-form-success-message' expr:id='data:widget.instanceId + "_contact-form-success-message"'/>
        </div>
      </form>
    </div>
</div>
<b:include name='quickedit'/>

بحيث سنترك الكود كما هو في الصورة:

6- الأن نعود إلى لوحة تحكم البلوجر و نذهب إلى "صفحات" ثم "صفحة جديدة" ثم "صفحة فارغة" كما في الصورة:

7- في عنوان الصفحة نضع Contact us ثم ننقر حفظ.
ثم نلصق الكود الموالي بعد أن نكون إخترنا HTML:

<div class='widget ContactForm' id='ContactForm1'>
<div class='contact-form-widget'>
    <div class='form'>
      <form name='contact-form'>
        <p>الإسم<p>
        <input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
        <p>البريد الإلكروني ٭</p>
        <input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
        <p>الرسالة ٭</p>
        <textarea class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
        <input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Submit'/>
        <p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
        <p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
      </form>
    </div>
</div>
</div>

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

ملاحظة مهمة:
قمنا بتسمية الصفحة ب Contact us حتى يتم إعطاؤها عنوان URL كالتالي:
http://yourblog.com/p/contact-us.html
و هو أكثر صداقة مع معايير SEO، و يمكننا في خطوة لاحقة تعديل هذا العنوان لما يناسبنا.
أما إن قمنا بتسميته مثلا "إتصل بنا" فسيكون ال URL هكذا:
http://www.yourblog.com/2014/02/blog-post.html
و هو مالا ينصح به إن كنت تأخد بعين الإعتبار SEO كما أنه لن يكون بإكماننا تعديل URL بعد ذلك.

8- الأن نرجع إلى "صفحات" ثم نختار "تعديل" و نعدل عنوان الصفحة مثلا إلى "إتصل بنا"، ونقوم بالنقر على تحديث Update.

9- أخيرا، ستقوم بوضع رابط الصفحة في المكان المناسب (غالبا في أسفل الصفحة)، من أجل ذلك تذهب إلى Template ثم Edit HTML و تلصق هذا الكود:

<a href='/p/contact-us.html'>إتصل بنا</a>

أرجوا أن أكون وفقت في الشرح.
إن كان لديكم أي تساؤل فضلا ضعوه في تعليق.

الأحد، 2 فبراير 2014

غير معرف 15:29

كيف تعدل أو تضيف favicon إلى مدونة بلوجر غوغل

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

يمكن للمدون الذي يستعمل غوغل بلوجر أن يضيف هذه الأيقونة بسهولة، إذ ماعليه إلا اتباع الخطوات التالية:

1- نذهب إلى Layout (التصميم) و نضغط على تعديل (Edit) كما تشاهدون في الصورة:

2- ثم Browse (تصفح) لنختار favicon التي نكون قد قمنا بإعدادها و نضغط بعد ذلك على Save (حفظ) كما في الصورة

قد يستفرق بعض الوقت حتى تظهر الأيقونة على المتصفح.

ملاحظات:
1- أيقونة favicon يجب أن تكون تنتهي ب .ico ، أن يكون وزنها لا يتجاوز 100 كيلوبايت، أن تكون مربعة، و من الأفضل أن تكون بقياس 16x16 بيكسل إن أردت ضمان إشتغالها مع أغلبية المتصفحات..
2- يمكن بطريقة أخرى إضافة أيقونة متحركة أي صورة من نوع gif، ولكن حيث أنها لا تشتغل مع بعض المتصفحات فإني لن أتطرق إليها.

3- يمكن أن تصنع favicon خاصة بموقع بمساعدة favicon.cc، أو يمكنك تحميل بعض الأيقونة الجاهزة منه.

دمتم في حفظ الله.

السبت، 1 فبراير 2014

غير معرف 16:51

كيف تقوم بإعادة توجيه دومين إلى أخر عند OVH

قد يحدث أن يكون لك إسم دومين و لكن لسبب ما فإنك تود تغييره. و لهذا فإنك ستفكر في كيفية توجيه العنوان القديم إلى العنوان الجديد، حتى لا تفقد مجموعة المتتبعين لموقعك.
في هذه التدوينة سنتناول بالشرح كيفية عمل ذلك في حالة أكانت الشركة المستضيفة هي OVH.

الطريقة سهلة يجب فقط تتبع الخطوات التالية:

1- أدخل إلى لوحة تحكم OVH، و اختار من القائمة اليسرى إسم الدومين القديم الذي نود إعادة توجيهه كما في الصورة

2- نختار domaine et dns من القائمة اليسرى ثم redirections web

3- الأن نختار création

4- ثم نملأ الحقلين:
الحقل نترك فارغا ليتم توجيه olddomain.com إلى عنواننا الجديد newdomain.com الذي سندخله في الحقل السفلي، و نترك Type كما هي و نقوم validez للتأكيد

5- نكرر نفس الخطوة السابقة و لكن هذه المرة سنوجه www.olddomain.com إلى www.newdomain.com كما في الصورة، لاحظوا أن الحقل الأول كتبنا فيه فقط

www

إن قمنا بالعملية الرابعة فقط و لم نقم بالخامسة فالزوار لن يصلوا إلى صفحتنا إن أدخلوا في متصفحهم www.olddomain.com
و إن قمنا بالعملية الخامسة فقط و لم نقم بالرابعة فالزوار لن يصلوا إلى صفحتنا إن أدخلوا في متصفحهم olddomain.com
لذا فمن المهم أن نقوم بكلتيهما.

6- و كنتيجة سيكون لدينا سطرين يظهران دي صفحة إعادة التوجيهات.

إنتهى، الأمر بسيط أليس كذلك؟

أنتظر ردودكم إن أفادكم الموضوع.

الخبراء العرب

دربك للخبرة في الإعلاميات و الإتصال

الخبراء العرب

الثلاثاء، 5 يناير 2016

إضافة أزرار (متجاوبة) لمشاركة الموضوع في مواقع التواصل الإجتماعي إلى مدونة بلوغر ( واتساب ، فيسبوك ، غوغل+ ، تويتر... )

الاثنين، 4 يناير 2016

طريقة إضافة صندوق الإعجاب - بصفحة الفيسبوك - المنبثق إلى مدونتك أو موقعك

الأحد، 3 يناير 2016

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

السبت، 2 يناير 2016

طريقة وضع إعلان أدسانس وسط الموضوع في أي مكان من اختيارك

الخميس، 6 فبراير 2014

كيف أضيف فهرس مواضيع جميل لمدونة بلوجر؟

كيف نقوم إذن بإضافة فهرس لكافة مواضيع المدونة؟

الأربعاء، 5 فبراير 2014

كيف تقوم بإخفاء الشريط الجانبي Sidebar في صفحات معينة في مدونة البلوجر

الثلاثاء، 4 فبراير 2014

كيف تقوم بإخفاء الإضافات widgets من الصفحات الثابتة static pages في مدونة البلوجر

الاثنين، 3 فبراير 2014

كيف تضيف نموذج أو صفحة الإتصال "إتصل بنا" لمدونة بلوجر؟

الأحد، 2 فبراير 2014

كيف تعدل أو تضيف favicon إلى مدونة بلوجر غوغل

السبت، 1 فبراير 2014

كيف تقوم بإعادة توجيه دومين إلى أخر عند OVH

إعلان

أشهر المواضيع

الوسوم

تابعونا عبر الفيسبوك

الخبراء العرب دربك للخبرة في الإعلاميات و الإتصال

الثلاثاء، 5 يناير 2016

الاثنين، 4 يناير 2016

الأحد، 3 يناير 2016

السبت، 2 يناير 2016

الخميس، 6 فبراير 2014

كيف نقوم إذن بإضافة فهرس لكافة مواضيع المدونة؟

الأربعاء، 5 فبراير 2014

الثلاثاء، 4 فبراير 2014

الاثنين، 3 فبراير 2014

الأحد، 2 فبراير 2014

السبت، 1 فبراير 2014

إعلان

أشهر المواضيع

الوسوم

تابعونا عبر الفيسبوك

الخبراء العرب

دربك للخبرة في الإعلاميات و الإتصال