كن متفائل

شريط أفقي أحترافي با تنسيقك الخاص

2015-01-02T07:40:00.000-08:00

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

شريط أفقي أحترافي با تنسيقك الخاص

من لوحة التحكم بلوجر
قالب
ابحث عن الوسم التالي </body> وضع فوقه قبله الكود التالي

<style>

#wcsticky-container {

height:46px;

width:100%;

position:fixed;

z-index:99999;

top: 0px;

left:0px;

background:#1172F5;

}

#wc-stickylinks

{

color:rgb(212, 244, 17);

font: 14px droid arabic kufi;

font-weight: normal;

margin-top:12px;

margin-right:20px;

text-decoration:none;

}

#wc-stickylinks a

{

font: 14px droid arabic kufi;

font-weight: normal;

color:#ffffff;

text-decoration:none;

}

#wcstickyclose

{

float:left;

margin-top:15px;

margin-right:20px;

}

#wcstickyclose a

{

color:rgb(212, 244, 17);

text-decoration:none;

font: 14px droid arabic kufi;

font-weight: normal;

padding:4px;

padding-top:16px;

padding-right:16px;

background:#000;

}

#wcsticky-main

{float:right;

}

</style>

<script language='JavaScript'>

function closesticky() {

document.getElementById("wcsticky-container").style.visibility = "hidden";

}

</script>

<div id='wcsticky-container'>

<div id='wcsticky-main'>

<p id='wc-stickylinks'> كن متفائل:<a href='#'>كل جديد ومفيد في عالم بلوجر معنا سوف تصبح مدون محترف</a> | <a href='http://cnmot.blogspot.com/'>أضف هذا الشريط الي مدونتك باضغط هنا</a></p>

</div>

<div id='wcstickyclose'>

<a href='javascript:closesticky();'>X</a>

</div>

</div>

واستبدل النص الملون بلون الاحمر بنص المراد عرضه علي مدونتك
واستبدل رابط مدونتي الملون بلون الأخضر برابط مدونتك
وأحفظ القالب ومبروك عليك الاضافة الرائعة في أمان الله

حصريا طريقة عرض عناوين المواضيع فقط علي الصفحة الرئيسية

2014-12-20T03:34:00.000-08:00

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

معاينة

طريقة عرض عناوين المشاركات فقط علي الصفحة الرئيسية

من لوحة التحكم بلوجر
نضغط علي قالب
من ثم تحرير html
ومن ثم نبحث عن الكود التالي </ head> بواسطة ctrl+f
ونضع فوقه الكود التالي

<style type='text/css'>

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

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

.post {

margin:.5em 0 1.5em;

border-bottom:0px dotted $bordercolor;

padding-bottom:1.0em;

height:50px;

}

.post h3 {

margin:.25em 0 0;

padding:0 0 4px;

font-size:20px;

font-family:Tahoma,Georgia,Century gothic,Arial,sans-serif;

font-weight:normal;

line-height:1.4em;

color:#cc6600;

}

.post h3 a, .post h3 a:visited, .post h3 strong {

display:block;

text-decoration:none;

color:#cc6600;

font-weight:normal;

}

.post h3 strong, .post h3 a:hover {color:#333333;}

.post-body {display:none;}

.post-footer {display:none;}

.comment-link {display:none;}

.post img {display:none;}

.post blockquote {display:none;}

.post blockquote p {display:none;}

h2.date-header {display:none;}

.post-labels {display:none;}

.post-rating {display:none;}

</b:if>

</b:if>

</style>

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

وفي الأخير لا يسعني الا ان أشكر زوار ومتبعي كن متفائل علي الزيارات اليومية لتي يقومون بها ولتي أفادت المدونة كثيرا في تخفيض ترتيبها عالميا في أمان الله ورعايته

قائمة أفقية أنيقة جدا وسهلة التنسيق

2014-12-18T09:42:00.000-08:00

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

معاينة

طريقة التركيب

بلوجر >> قالب >> تحرير html وفوق هذا الوسم ]]></b:skin> نضع الكود التالي

.cnmot {

background: #ddfaf8;

border: 1px solid #BACAD9;

padding: 10px;

}

نظرة عامة علي الكود

#ddfaf8 : هذا الكود المسؤول عن الخلفية

#BACAD9 : وهذا لون خط البوردر

10px : وهذا مسؤول عن المسافة بينهما

الخطوة الثانية والأخيرة من طريقة تركيب القائمة

تخطيط >> اضافة آداة >> نختار >> java /html ونضع بها الكود التالي

<div align="center" class='cnmot'>

 <a href='#'><img alt='Home' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivWhDqWVhRFC2LzHLzLlp1RXJSoAxfzO8RoOKvs8pMVKzwps1V05SeWfmepbhyQK3DG1voSQhi6QQm72yS4lZShjv_FIbIC4pwXaM5PUpVe7RD_iMr9jrKfe_yT8CJV8EUCqCNFqUYzTY/s1600/home.png' title='الصفحة الرئيسية'/></a>

<a><img alt='2' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipqsN3m5pOhl0JhZO3TiJCILbdQU2VpGzygMMLdnYjyiL2PCAFRmfnCVp3WQkGluKf09IvYmhvSJDtf34OCgXSTT18bHriDH9EvkHR2RdPp_sUerYRht_1ldLblYSk4UAks8bmt41QfBc/s1600/2.gif' title='2'/></a>

<a href='#'><img alt='Quran' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1m8gsM7gBbDB3TzCxmNH9nVAxPmwCTdtHHC2W7PP0E8ZgsHl4KxwLe-qjDZsvLjLedurcm6vnmny_La1YZ10ig7Tc87NTJQ0AcK5tIibEpr7nNeXjAHrzbL2Jjlb7PrR6LSItwOU1vXg/s1600/alQuran.png' title='القرآن الكريم'/></a>

<a><img alt='2' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipqsN3m5pOhl0JhZO3TiJCILbdQU2VpGzygMMLdnYjyiL2PCAFRmfnCVp3WQkGluKf09IvYmhvSJDtf34OCgXSTT18bHriDH9EvkHR2RdPp_sUerYRht_1ldLblYSk4UAks8bmt41QfBc/s1600/2.gif' title='2'/></a>

<a href='#'><img alt='Culture' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsvWKORNSt6zJyUiQLh51jhIZGPkBJ3uDJgDRfx6D2j5Y_lSxo1qePx91p786CkpkdVpGEShaPqys92CO1OYzOlfEfDIlcKvGbt-Qkc9JPAsZ2A0VtqI2q8H4eqchh7QNTCNgdcnQkKFk/s1600/book-icon.png' title='مواقع ثقافية'/></a>

<a><img alt='2' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipqsN3m5pOhl0JhZO3TiJCILbdQU2VpGzygMMLdnYjyiL2PCAFRmfnCVp3WQkGluKf09IvYmhvSJDtf34OCgXSTT18bHriDH9EvkHR2RdPp_sUerYRht_1ldLblYSk4UAks8bmt41QfBc/s1600/2.gif' title='2'/></a>

<a href='#'><img alt='TV' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxlUeq7vgs7gK31HTYKhfFrqGjERlQQJg3qDVtvLyJ0porA9u76AYA_qHTGeH4sfNwPtdfLZnG_HuoDoozYf5B3FUMDgyXyUcQI2kpJ2B8G8RRsiN2NIVmU08KixCF0K3q2k2TgXERUU4/s1600/tv-icon.png' title='البث المباشر'/></a>

<a><img alt='2' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipqsN3m5pOhl0JhZO3TiJCILbdQU2VpGzygMMLdnYjyiL2PCAFRmfnCVp3WQkGluKf09IvYmhvSJDtf34OCgXSTT18bHriDH9EvkHR2RdPp_sUerYRht_1ldLblYSk4UAks8bmt41QfBc/s1600/2.gif' title='2'/></a>

<a href='#'><img alt='Business' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhERwwmyYLaK16PKPKM544Z29yU7pNHgF3VyTxEknTynfBH35ORJJCDgwKWZu0V3Q3W0BZlO2TUpKxktsYFcFWesOL2w8BABAvXpSkbENJ6AmJ-Em-hGdi0PXwRGJgPiuN3MARRoQITtvM/s1600/finance-and-business.png' title='أخبار الاقتصاد'/></a>

<a><img alt='2' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipqsN3m5pOhl0JhZO3TiJCILbdQU2VpGzygMMLdnYjyiL2PCAFRmfnCVp3WQkGluKf09IvYmhvSJDtf34OCgXSTT18bHriDH9EvkHR2RdPp_sUerYRht_1ldLblYSk4UAks8bmt41QfBc/s1600/2.gif' title='2'/></a>

<a href='#'><img alt='Sport' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipqfUAIba4KGehV33zt8EhUGQqlZ2itSyufsMLCaVSt0DQCPfJ0ffQ0w1Avb0-J6e8DTHNSzyzXA1Ku4ANLSwAFCowExTn2YX92S4SpkHM4_Tn1vgHRK-hgrSFZhLpvYqYTbAdnVdGpOk/s1600/sport.png' title='أخبار الرياضة'/></a>

<a><img alt='2' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipqsN3m5pOhl0JhZO3TiJCILbdQU2VpGzygMMLdnYjyiL2PCAFRmfnCVp3WQkGluKf09IvYmhvSJDtf34OCgXSTT18bHriDH9EvkHR2RdPp_sUerYRht_1ldLblYSk4UAks8bmt41QfBc/s1600/2.gif' title='2'/></a>

<a href='#'><img alt='Contact us' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOgrmeE6zJi9mY0ANBPVLbpG6b3qoq-pwmJUzbOyWikoFU31G7Oj35sM1G17UbyI7r6DVTo5JxP_Y99S2OFPpVJUeHjamRdTohPAIBWHR5EgzdoYuJLVzmcUIfDLg9x-tdIb0rI0XeR0o/s1600/contact-us.png' title='اتصل بنا'/></a>

<a><img alt='2' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipqsN3m5pOhl0JhZO3TiJCILbdQU2VpGzygMMLdnYjyiL2PCAFRmfnCVp3WQkGluKf09IvYmhvSJDtf34OCgXSTT18bHriDH9EvkHR2RdPp_sUerYRht_1ldLblYSk4UAks8bmt41QfBc/s1600/2.gif' title='2'/></a>

<a href='#'><img alt='FRANÇAIS' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6ba1Dqz2weGKi16KuZ09HVODI2UGLyA9tgJEtBglL-U9koqI57KnnbYZari6fKofgaw2CQBldZdbx5rEDthWh10l3RXle_vxcHwxAezv0EYVw2jeDIY5i6fN5-XiichsQVLIy_LDWfNE/s1600/fr.png' title='المدونة با الفرنسية'/></a>

</div>

نظرة عامة علي الكود

# : استبدله برابط الذي تريد

الملون بلون الأحمر هو رابط الصور ان اردتم استبدالهم

والي هنا ينتهي موضوعنا اليوم في أمان الله

أنواع صفحات بلوجر وتعريفها

2014-12-13T13:19:00.001-08:00

هناك اربعة أنواع من الصفحات الأساسية في بلوجر التي يمكننا التمييز بينها من خلال xml الخاص بابلوجر,أسفل هذا السطر سوف توجد هذه الأنواع مع تعريفها

1- الأرشيف

صفحات الأرشيف تشير الي الصفحات التي تمت اضافتها من طرف Widget الخاصة بأرشيف بلوجر،وهي عادة لديها “_archive.html” في أخر عنوان URL.وهدا الكود هو شرط للتحقق من أن نوع الصفحة هي الأرشيف

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

<title>

Posts Archive | <data:blog.title/>

</title>

</b:if>

2- صفحات الأندكس index

صفحة الاندكس تشير الي الصفحات من الصفحة الرئيسية متلا cnmot.blogspot.com والي صفحات البحت search.الصفحة التي بها لائحة المواضيع هي ببساطة صفحة index. وهدا الكود هو شرط للتحقق من أن نوع الصفحة هي index

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

</b:if>

3- صفحة الموضوع Item

صفحة الموضوع أو item page تشير الي موضوع المدونة blogger post . وهدا الكود هو شرط للتحقق من أن نوع الصفحة هي item

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

<title>

<data:blog.pageName/> | <data:blog.title/>

</title>

</b:if>

4- الصفحات التابتة Static Page

الصفحات التابتة تشير الي صفحات البلوجر أي الصفحات التي يتم انشائها عن طريق زر
اضافة صفحة وهدا الكود هو شرط للتحقق من أن نوع الصفحة هي static page

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

<title>

<data:blog.pageName/> | <data:blog.title/>

</title>

</b:if>

باستعمال شرط البلوجر if ،نستطيع استخدام كود الsnippets أعلاه لادخال عنوان خاص بكل

صفحة استمتعوا بالتدوين.

سلايدر أنيق وسهل التنسيق

2014-12-13T11:51:00.001-08:00

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

معاينة

طريقة تركيب سلايدر

من لوحة التحكم بلوجر
قالب
تحرير html
نبحث عن الوسم التالي </head> ونضع أسفله الكود التالي

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

<script type='text/javascript'>

//<![CDATA[

/* ------------------------------------------------------------------------

s3Slider

Developped By: Boban KariÅ¡ik -> http://www.serie3.info/

CSS Help: MÃ©szÃ¡ros RÃ³bert -> http://www.perspectived.com/

Version: 1.0

Copyright: Feel free to redistribute the script/modify it, as

long as you leave my infos at the top.

-------------------------------------------------------------------------- */

(function($){

$.fn.s3Slider = function(vars) {

var element = this;

var timeOut = (vars.timeOut != undefined) ? vars.timeOut : 4000;

var current = null;

var timeOutFn = null;

var faderStat = true;

var mOver = false;

var items = $("#" + element[0].id + "Content ." + element[0].id + "Image");

var itemsSpan = $("#" + element[0].id + "Content ." + element[0].id + "Image span");

items.each(function(i) {

$(items[i]).mouseover(function() {

mOver = true;

});

$(items[i]).mouseout(function() {

mOver = false;

fadeElement(true);

});

});

var fadeElement = function(isMouseOut) {

var thisTimeOut = (isMouseOut) ? (timeOut/2) : timeOut;

thisTimeOut = (faderStat) ? 10 : thisTimeOut;

if(items.length > 0) {

timeOutFn = setTimeout(makeSlider, thisTimeOut);

} else {

console.log("Poof..");

}

}

var makeSlider = function() {

current = (current != null) ? current : items[(items.length-1)];

var currNo = jQuery.inArray(current, items) + 1

currNo = (currNo == items.length) ? 0 : (currNo - 1);

var newMargin = $(element).width() * currNo;

if(faderStat == true) {

if(!mOver) {

$(items[currNo]).fadeIn((timeOut/6), function() {

if($(itemsSpan[currNo]).css('bottom') == 0) {

$(itemsSpan[currNo]).slideUp((timeOut/6), function() {

faderStat = false;

current = items[currNo];

if(!mOver) {

fadeElement(false);

}

});

} else {

$(itemsSpan[currNo]).slideDown((timeOut/6), function() {

faderStat = false;

current = items[currNo];

if(!mOver) {

fadeElement(false);

}

});

}

});

}

} else {

if(!mOver) {

if($(itemsSpan[currNo]).css('bottom') == 0) {

$(itemsSpan[currNo]).slideDown((timeOut/6), function() {

$(items[currNo]).fadeOut((timeOut/6), function() {

faderStat = true;

current = items[(currNo+1)];

if(!mOver) {

fadeElement(false);

}

});

});

} else {

$(itemsSpan[currNo]).slideUp((timeOut/6), function() {

$(items[currNo]).fadeOut((timeOut/6), function() {

faderStat = true;

current = items[(currNo+1)];

if(!mOver) {

fadeElement(false);

}

});

});

}

}

}

}

makeSlider();

};

})(jQuery);

//]]>

</script>

<script type='text/javascript'>

$(document).ready(function() {

$('#s3slider').s3Slider({

timeOut: 4000

});

});

</script>

<style type='text/css'>

#s3slider {

background:#000000;

border:1px solid #818e8f;

width: 550px;

height: 200px;

position: relative;

overflow: hidden;

}

#s3sliderContent {

width: 550px;

position: absolute;

top:0px;

padding: 0px;

margin: 0px;

}

.s3sliderImage {

float: left;

position: relative;

display: none;

}

.s3sliderImage span {

position: absolute;

left: 0;

font: 20px Trebuchet MS, sans-serif;

padding: 10px 0px;

width: 550px;

background-color: #000;

filter: alpha(opacity=80);

-moz-opacity: 0.8;

-khtml-opacity: 0.8;

opacity: 0.8;

color: #fff;

display: none;

bottom: 0;

text-align:center;

}

.clear {

clear: both;

}

</style>

شرح بعض خصائص الكود

ملاحظة: لتغيير سرعة عرض الشرائح، نغيير قيمة 4000 الملون في الكود با الون الأحمر
550: عرض السلايدر
200: طول السلايدر

وأحفظ القالب

وبعد حفظ القالب نذهب الي تخطيط --> اضافة آداة -->

نختار html/java script ونضع بها الكود التالي

<div id="s3slider">

<ul id="s3sliderContent">

<li class="s3sliderImage"><a href="#"><img style="width:550px;height:200px;" src="هنا رابط صورة الموضوع الأول" /><span>وصف الموضوع الأول</span></a></li>

<li class="s3sliderImage"><a href="#"><img style="width:550px;height:200px;" src="هنا رابط صورة الموضوع الثاني" /><span>وصف الموضوع الثاني</span></a></li>

<li class="s3sliderImage"><a href="#"><img style="width:550px;height:200px;" src="هنا رابط صورة الموضوع الثالث" /><span>وصف الموضوع الثالث</span></a></li>

<li class="s3sliderImage"><a href="#"><img style="width:550px;height:200px;" src="هنا رابط صورة الموضوع الرابع" /><span>وصف الموضوع الرابع</span></a></li>

<li class="s3sliderImage"></li>

</ul>

</div>

<div class='clear'></div>

شرح بعض خصائص الكود

# نغيرها برابط الموضوع

550 عرض السلايدر

200 طول السلايدر

في أمان الله ورعايته

اضافة بطاقة تعريفية لصاحب المدونة

2014-12-12T03:26:00.000-08:00

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

اضافة بطاقة تعريفية لصاحب المدونة

من لوحة التحكم بلوجر
قالب
تحرير html
وبحث فيقالب مدونتك عن الوسم التالي ]]></b:skin> وضع فوقه الكود التالي

.cnmot tr, .cnmot th {

border: 1px dashed #000;

padding: 1px 10px 3px;

text-align: center;

font-size: 16px;

background: #fff;

width:300px;

margin-Right:-10px;

}

.rotbah {

background: #1172F5;

color: #FFFFFF;

display: block;

font-size: 16px;

margin: -10px 10px 5px;

width:300px;

margin-Right:-10px;

}

aubioh2 {

background: #000;

color: #FFFFFF;

font-size: 16px;

font-weight: bold;

margin: 12px -6px 10px -7px;

text-align: center;

display: block;

width:300px;

margin-Right:-10px;}

طبعا الكود منسق بشكل جيد ولا يحتاج الي شرح مفصل علي ما أظن

الخطوة الثانية والأخيرة

بلوجر >> قالب >> تحرير html وأبحث عن الكود التالي <div id='sidebar-wrapper'>

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

<div id='authorbio'>

<center>

<aubioh2>مدير الموقع</aubioh2>

<strong class='rotbah'>ضع اسمك هنا</strong>

<table class='cnmot'>

<tr>

<th style='width:30px;'>الجنسية</th>

<th style='width:85px;'>أكتب اسم بلدك هنا</th>

</tr>

<tr>

<th>العمر</th>

<th>أكتب هنا عمرك با السن</th>

</tr>

<tr>

<th>الموقع</th>

<th><a href='وهنا رابطها '>ضع هنا اسم مدونتك<a/></a></th>

</tr>

</table></center>

</div>

وبعد تغير ماهو ملون با الون الأخضر والأحمر أحفظ قالب مدونتك ومبروك عليك الاضافة

أكواد الميتا تاج لتحسين الأرشفة

2014-12-11T14:18:00.000-08:00

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

ماهي أكواد الميتا تاج

انها معلومات وكلمات يتم وضعها فى الموقع داخل وسم “head”

لا يستطيع المستخدمين رؤية هذه الاكواد الخاصة بك ولكنهم يستطيعون معرفة عنوان الصفحة للمدونة فقط

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

طريقة اضافة أكواد الميتا تاج

من لوحة التحكم بلوجر
قالب
تحريرhtml
أبحث عن الوسم التالي <head> وأحذف مابينه هو والوسم التالي <b:skin>
بعد حذفك الأكواد لتي بين الوسمين ضع الكود التالي أسفل هذا الوسم <head>

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

<meta content=' وصف المدونة' name='description'/>

<meta content='كلمات , دلائلية' name='keywords'/>

<meta content='رابط بانر' name='og:image'/>

<meta content='global' name='distribution'/>

<meta content='10 days' name='revisit'/>

<meta content='10 days' name='revisit-after'/>

<meta content='document' name='resource-type'/>

<meta content='all' name='audience'/>

<meta content='general' name='rating'/>

<meta content='all' name='robots'/>

<meta content='index, follow' name='robots'/>

<meta content='إسمك بالإنجليزية' name='author'/>

<meta content='ar' name='language'/>

<meta content='بلدك بالإنجليزية' name='country'/>

</b:if>

<b:include data='blog' name='all-head-content'/>

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

<title><data:blog.pageName/></title>

<b:else/>

<title><data:blog.pageTitle/></title>

</b:if>

الطريقة الصحيحة لتعديل علي كود الميتا تاج

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

كلمات , دلائلية: أكتب كلمات دلالية تكون مستخدم في مدونتك بشكل كبير وأفصل بين كل واحد با الفاصلة

رابط بانر: شعار مدونتك أو صورة مدونتك علي الفيسبوك

إسمك بالإنجليزية: أكتب اسمك با الانجليزية وليكن قصير

بلدك با الانجليزية: أكتب اسم بلدك با الغة الانجليزية

وفي الأخير أضغط علي حفظ القالب

سوف تأخذ هذه المعلومات يوم أو يومان لتظهر في محركات البحث

في أمان اللــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــه

اضافة صندوق المتابعون المخصص لمدونات بلوجر

2014-12-09T14:47:00.001-08:00

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

اضافة صندوق المتابعون المخصص لمدونات بلوجر

من لوحة التحكم بلوجر
تخطيـــــــــــــط
اضافـــــــة آداة
الأساسيات
المزيد من الأدوات
نختار المتابعون

الشرح با الصور كما عودتكم

وبهذا تكون قد أضفت صندوق المتابعون الي مدونتك

في أمان اللــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــه

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

2014-12-08T12:35:00.000-08:00

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

طريقة انشاء صفحة جديدة علي بلوجر

من لوحة التحكم بلوجر
الصفحات
صفحة جديدة

الشرح با الصور

نضغط علي الخيارات ونقوم بعمل كما في الصورة التالية

وبهاذا تكون قد انشأت صفحة جديدة علي مدونتك

في أمان اللــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــه

اضافة فواصل المزيد من المعلومات لمدونات بلوقر

2014-12-07T13:42:00.001-08:00

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

سأشرحه في هذه التدوين تابعو الشرح

اضافة فواصل المزيد من المعلومات لمدونات بلوقر

عند كتابتك الموضوع معين ماعليك سوي بتحديد النص الذي تريد ان تضيف الفاصل تحته

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

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

المزيد من المعلومات اي اقرا المزيد

النتيجة

طريقة تغير المزيد من العلومات با اقرا المزيد

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

طريقة تنسيقها

أبحث عن الكود هذا الوسم ]]></b:skin> وأضف فوقه الكود التالي وأحفظ القالب

.jump-link, .jump-link a {
border-radius: 0 9px 0 9px;
background: none repeat scroll 0 0 #EFEFEF;
border: 1px solid #D2D2D2;
display: block;
float: left;
font-family: tahoma;
height: 20px;
padding: 3px;
text-align: center;
text-decoration: none;
width: 130px;
}

الي هنا ينتهي موضوعنا اليوم في أمــــــــــــــــــــــــان الله ورعايته

اضافة وتهيئة اشارة جوجل بلس

2014-12-04T04:40:00.000-08:00

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

اضافة وتهيئة شارة جوجل بلس

من لوحة التحكم بلوجر
تخطيط
اضافة آداة
نختارة تهيئة شارة google +
عند الضغط علي تهيئة شارة جوجل سوف تفتح بهذا الشكل

طريقة تهيئتها

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

وبهذا تكون قد أضفت اشارة جوجل بلس الي مدونتك في أمان الله ورعايته

أرشفة المدونات ومخاطبة عناكب جوجل

2014-12-03T10:00:00.002-08:00

كيف ينظر جوجل الى المدونات

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

مخاطبة عناكب جوجل لارشفة المدونات

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

طريقة انشاء حساب جوجل وعمل مدونة بلوقر

2014-12-03T06:13:00.000-08:00

السلام عليكم أهلا ومرحبا بكم مرة أخري في مدون كن متفائل في هذا الدرس ان شاء الله سوف أقوم بشرح طريقة انشاء حساب جوجل وعمل مدونة بلوقر كلنا نعرف ان منصة بلوجر مجانية وتابعة لشركة جوجل العملاقة ان شاء الله سوف أشرح لكم من الالف الي الياء طريقة عمل حساب جوجل أي gmail وعمل مدونة blogger تابعو معي الشرح ان شاء الله .

طريقة عمل حساب جوجل gmail

أولا وقبل كل شيئ نذهب الي جوجل عبر الرابط التالي جوجل انشاء حساب

وعند فتح الرابط سوف تظهر الكم صورة التالية نطبق كما في الصور

1- بعد الدخول نضغط علي ان شاء حساب كما هو موضح في الصورة

2- وبعد الضغط علي انشاء حساب سوف تظهر لكم الصورة التالية

3- وبعد ملئ الخانات نضغط علي الخطوة التالية وسوف تظهر لك الصورة التالية

4- هنا يجب اثبات الملكية وذلك با الهاتف سوف تصلك رسلة علي هاتفك

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

ونضغط متابعة

عند ادخال رقم التحقق وضغط علي متابعة تكون بهذا قد انشأت حساب gmail

طريقة عمل مدونة بلوقر

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

عمل مدونة بلوقر

بعد الدخول الي بلوجر سوف تظهر لك الواجهة التالية الرجاء اتباع الشرح با الصور

1- اضغط علي مدونة جديد كما في الصورة التالية

2- بعد الضغط علي مدونة جديد سوف تظهر لك الصورة التالية

نقوم بكتابة اسم المدونة المراد انشائها في الخانة الأولي

وكتابة عنوان المدونة اي عمل رابط وعند اظهار علامة صح فا رابط موجود

ومن ثم اشغط علي انشاء المدونة وبهذا تكون قد انشأت مدونة خاصة بك والحمد اله

الي هنا ينتهي موضوعنا اليوم في أمان الله ورعايته

كيفية ادراج أكواد html في المدونة

2014-12-03T04:22:00.000-08:00

لقد وضعت لكم هذا الموضوع البسيط جدا حتى لا نشتت المبتدئين الجدد على بلوجر وحتى تكون المعلومه كامله كيفية ادراج اكواد html في المدونة طبعا طريقة تركيب الاضافات عبر اكواد جافا مسالة بسيطة جدا وهذا ماسوف أشرحه في هذا الدرس
اولا : ما هى html ؟
html هى لغه برمجه بسيطه تستخدم فى تصميم صفحات الانترنت والمواقع
ونستخدمها فى المدونات بلوجر لتقوم باضافه وظيفه محدده لا تقدمها بلوجر لك.

طريقه اضافه اكواد html الى المدونه

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

الأمر بسيط جدا زواري الكرام في أمان الله ورعايته

اضافة أزرار المشاركة أسفل الموضوع لمدونات بلوقر

2014-12-02T19:45:00.000-08:00

السلام عليكم أهلا ومرحبا بكم في مدونة كن متفائل اليوم ان شاء الله سوف أقدم لكم اضافة جميلة ويجب علي كل مدون اضافتها الي مدونته هذه الاضافة هي أزرار المشاركة أسفل المواضيع فقط لمدونات بلوقر هذه الاضافة تحمل بين طياتها حمسة مواقع شهيرة جدا ويرتادها الملاين من الزوار يوميا وهي facebook - twitter - google+ - digg - lintaskan وبعد اضافتك لهذه الاضافة سيتمكن زوار مدونتك من مشاركة مواضيع مدونتك عبر هذه المواقع .

معاينة

طريقة اضافة أزرار المشاركة أسفل الموضوع لمدونات بلوقر

قالب >> تحرير ابحث عن الوسم ]]></b:skin> و اضف الكود التالي فوقه

#share-button{margin:8px 0;padding:0;overflow:hidden;margin-top: 25px;margin-bottom: 12px;}#share-button p{float:right;box-shadow:1px 1px 5px rgba(1,1,1,.1);background:#fafafa;display:block;padding:5px 8px !important;margin:0 3px 3px 0;border-radius:6px 6px;border:1px solid #fff}#share-button a{position:relative;float:right;box-shadow:1px 1px 5px rgba(1,1,1,.1);border-radius:6px 6px;display:block;color:#fafafa;padding:5px 8px;margin:0 3px 3px;border:1px solid #fff}#share-button a:hover{top:1px;right:1px;box-shadow:0px 0px 3px rgba(1,1,1,.1)}

ابحث عن هذا الكود <data:post.body/> و اضف الكود التالي أسفله

<div id='share-button'>

<p>Share to</p>

<a expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' style='background:#3b5998;'>Facebook</a>

<a expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' style='background:#c0361a;'>Google+</a>

<a expr:href='"https://twitter.com/intent/tweet?url=" + data:blog.url + "&text=" + data:post.title + "&lang=id"' rel='nofollow' style='background:#4099ff;'>Twitter</a>

<a expr:href='"http://digg.com/submit?url=" + data:blog.url' rel='nofollow' style='background:#000;'>Digg</a>

<script>

//<![CDATA[

var uri = window.location.href;

var ttle = document.title;

document.write("<a href='http://www.lintas.me/?c=bookmarklet&url="+uri+"&title="+ttle+"' rel='nofollow' style='background:#FF9900;'>Lintaskan</a>");

//]]>

</script>

<div class='clear'/>

</div>

وأضغط حفظ القالب ومبرو عليك الاضافة في أمان الله

أزرار المواقع الاجتماعية بشكل أنيق

2014-12-02T13:13:00.000-08:00

لاشك ان المواقع الاجتماعية تلعب دورا كبيرا في نشر محتوي مدونتك
وتخفيض ترتيب موقعك عالميا اليوم ان شاء الله سوف أشرح لكم طريقة اضافة هذه الاضافة الرائعة جدا وهي أزرار المواقع الاجتماعية بشكل أنيق جدا هذه الاضافة تحمل بين طياتها
facebook - twitter - google plus - pinterest - rss feedds هناك العديد من المواقع الاخري ولكني أخترت لكم هذه المواقع الأن زوارها كثيرون جدا لن أطيل عليكم اكثر تابعو الشرح .

طريقة التركيب

من لوحة بلوجر >> تخطيط >> اضافة آداة نختارHTML/JavaScript ونضع بها الكود التالي

<div id="mbl-social-hover"> <div class="tota2"><img src="" /></div> <div id="links"><a href="http://twitter.com/moutavaele" class="twitter" title="Twitter" target="_blank"><div class="tota"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGx2IJ2h0v8FhxlaKBeo_r-B9aqTZlH25yzvW3irmzTz8mytcPasrOqDD3jHqAMIA1JYOl2nKS7RYJqKC-W0OkbFeNSAZ81kECtssoTMpiH-wqq2i01lUpAEhFrkFX-lwzcso5Jz6RegQ/s1600/twitter.png" /></div></a> <a href="http://www.facebook.com/cnmotvaele" class="facebook" title="Facebook" target="_blank"><div class="tota"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEkS0xjkwjepVhV8OtFO23mnN29DszPp2392qitsSRR0tY2ndf5ZCsTdLqLZoBo3O19c_9nWLREZmQiRUL-I3GIPbc1VcaUkMwqirJ-cXMOtkhPn35JZvOlZlDrdicUptwR6eKUPPVxb0/s1600/FB.png" /></div></a> <a href="https://plus.google.com/u/0/111631038678757507895" class="google" title="Google Plus" target="_blank"><div class="tota"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhfmOeXJH0B_J8nbm4Uvn26RtQZRscxSPeFWG9twHIVIu1xg24WjmSViWCRkV-nlfVzKdnL65___VHhilvepPEZLsMjsXtXHc5AvA_L0UpoTfiDtt5mn0aDcDOmf1_4Jh_TD299B4eSbU/s1600/google.png" /></div></a> <a href="http://pinterest.com/cnmoavaele/" class="pinterest" title="Pinterest" target="_blank"><div class="tota"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQ5K_U2g9M63RvrCVguWAsiLOvqBJn_rBWmmF9nY5ga9zTGtEw8yGnDxUjfvPlD00MG_BgZ09-kbsAriYNfkpYQ5ToF7N8qYpNuqC801RQFBTXb9u2voU9GivE8JdeYIdb97FAlb60E4o/s1600/pin.png" /></div></a> <a href="http://feeds.feedburner.com/cnmot" class="rss" title="Feedburner" target="_blank"><div class="tota"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWaTgbEAoiXlPR6ANfr3RB5qyiN2nDsQ1TMt3uzvrIRBAvLyti46vjS3Nhm0hZTlS91y9Pji5GX9T-dqXFa5PnL3vIbMr2-OB6Bs4GPmGYGpuaU9POYjDvDVJScIaspE-2OcrZWCGtB8Q/s1600/rss.png" /></div></a> </div></div> <style>.tota2 { margin-left:15px; margin-top:0px;}.tota { margin-top:7px; }#mbl-social-hover{position:relative;width:240px;height:215px;background:#554e4c url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4GsdCIIWCRph6-NIOOT30kfrNpSqlBy1kbSPvfzL4bsgXeiaI6xH01ccAW3InCTQzsM6GzXJMWLt5XnctIyGxr4AZMCRqUAtwMBZX-C1wauh20f6_MtU1r82KsKpPD0be050YLLh1vFM/s1600/vintage.png");}#mbl-social-hover #title{font-family:'Open sans';font-size:28px;color:#fff;font-weight:600;margin:30px 20px 0;text-align:center;line-height:1.1em;text-shadow:1px 1px 1px rgba(0,0,0,0.3);}#mbl-social-hover #title span{display:block;font-size:14px;line-height:1.5em;margin-top:10px;font-weight:400;}#mbl-social-hover #links{position:absolute;bottom:0;width:100%;}#mbl-social-hover a{display:block;padding:0 20px;height:42px;line-height:42px;color:#fff;font-size:12px;background:rgba(0,0,0,0.08);border-top:1px solid #4c4644;border-top:1px solid rgba(0,0,0,0.1);-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;}#mbl-social-hover a:hover{background:rgba(0,0,0,0.15);text-decoration:none;}#mbl-social-hover a.twitter:hover{background:#79dbff;}#mbl-social-hover a.facebook:hover{background:#6e9bee;}#mbl-social-hover a.google:hover{background:#00be00;}#mbl-social-hover a.pinterest:hover{background:#cb2027;}#mbl-social-hover a.rss:hover{background:#ffae42;}#mbl-social-hover a span{height:15px;line-height:15px;width:15px;text-align:center;margin-right:20px;font-size:13px;padding:5px;border-radius:99px;background:rgba(0,0,0,0.1);}#home-tagline{text-align:center;font-size:32px;color:#000;font-weight:300;margin:60px 0 40px;}#home-tagline strong{color:#ff5421;font-weight:300;}#home-highlights{margin-bottom:40px;}.home-highlight{float:left;width:142px;padding:30px 0;margin-right:21px;text-align:center;font-size:13px;display:block;opacity:0.9;color:#796f6c;font-size:40px;background:#e2e0df;background:rgba(0,0,0,0.04);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;}.home-highlight p{margin:0;}.home-highlight:hover{color:#3a3534;text-decoration:none;background:rgba(0,0,0,0.1);}.home-highlight-title{font-size:13px;margin:7px 0 0;text-align:center;color:#796f6c;cursor:pointer;font-weight:900;-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;}.home-highlight:hover .home-highlight-title{color:#3a3534;}#home-featured{min-height:400px;margin-bottom:37px;}#home-featured .home-divider{margin-top:0;}#home-featured h2{text-align:center;font-size:32px;color:#161414;font-weight:300;margin:0 0 40px;}#home-featured h2:after{display:block;content:"";width:342px;margin:0 auto;height:1px;background:#161414;margin-top:5px;}.featured-theme-entry-content{font-size:16px;float:left;width:430px;font-weight:300;}.featured-theme-entry-content h3{font-size:21px;line-height:1.4em;margin:0;font-weight:400;}.featured-theme-entry-content .button{margin-top:15px;}.featured-theme-entry-content .button:hover{background:#f5634a;opacity:1;}.featured-theme-entry-img{display:block;float:right;margin-right:5px;}.featured-theme-entry-img a{display:block;padding:6px;background:#fff;border-radius:2px;}#featured-theme-slider .flex-control-nav{position:absolute;top:-20px;left:-54px;}#featured-theme-slider .flex-direction-nav{margin:0;}#featured-theme-slider .flex-direction-nav li a{background:#312d2c;cursor:pointer;display:block;height:70px;line-height:70px;width:30px;color:#fff;text-align:center;margin:-30px 0 0;position:absolute;top:50%;-moz-transition:background 0.3s ease-in-out 0s;opacity:0.15;border-radius:4px;}#featured-theme-slider .flex-direction-nav li .flex-prev{left:-90px;}#featured-theme-slider</style>

تغيرات بسيطة علي الكود نبحث عن

moutavaele: غيره با اسم حسابك علي التويتر

cnmotvaele: وغيره برلبط صفحتك علي الفيسبوك

111631038678757507895: وغيره يا المعرف الخاص بك علي جوجل بلس

cnmoavaele: غيره برابط صفحتك علي pinterest

cnmot:غيره برابط حسابك علي فيدبورنر

وأضغط حفظ ومبروك عليك الاضافة الأنيــــــــــــــــــــــــــــــــــــــقة

صندوق أزرار المتابعة

2014-12-01T19:47:00.002-08:00

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

صندوق ازرار المتابعة

من لوحة التحكم بلوجر >> قالب >> تحرير HTML ونبحث عن الوسم التالي </head>

ونضع فوقه الكود التالي

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

واضغط حفظ القالب

ونتوجه الي تخطيط >> اضافة آداة >>ونختار HTML/JavaScript ونضع بها الكود التالي

<style>
#cnmot {
background: none repeat scroll 0 0 #F3F3F3;
border: 1px solid #D7D7D7;
top: 680px;
display: none;
padding: 12px 14px;
position: fixed;
right: 2px;
width: 300px;
z-index: 3;
}
</style>

<script type="text/javascript">
$(window).scroll(function(){
if($(document).scrollTop()>=$(document).height()
/4)$("#cnmot").show("slow");
else $("#cnmot").hide("slow");});
function closecnmot(){$('#MDslidebox').remove();}
</script>
<div id="cnmot" style="display: none;">
<a onclick="return closecnmot();" href="javascript:void(0);" style="position:absolute;top:10px;left:10px;color:#000;font-size:10px;font-weight:bold;">اغلاق</a>
<span style="font-size:14px;color:#000;font-weight:bold">تابعونا عبر المواقع التالية</span>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/1500378103567335&width=292&height=62&colorscheme=light&show_faces=false&border_color=black&stream=false&header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:62px;" allowtransparency="true"></iframe>
<br/>

<div class="g-plus" data-width="300" data-height="69" data-href="https://plus.google.com/111631038678757507895" data-rel="publisher"></div>

<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script>
<br/>
<a href="https://twitter.com/cnmotvael" class="twitter-follow-button" data-show-count="false">Follow @cnmotvael</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>

تعديلات علي الكود

111631038678757507895:غيره با المعرف الخاص بصفحتك علي جوجل بلس

cnmotvael: المعرف الخاص بي علي التويوتر غير با المعرف الخاص بحسابك علي التويتر

1500378103567335:هذا رابط صفحتي علي الفيسبوك غيره برابط صفحتك

وأضغط حفظ ومبروك عليك الاضافة

طريقة البحث في قوالب بلوجر عن كود معين

2014-12-01T11:21:00.000-08:00

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

طريقة البحث في قوالب بلوجر عن كود معين

من لوحة التحكم بلوجر >> قالب تحرير HTML نضغط علي CTRL+F

بعد الضغط علي CTRL+F من لوحة المفاتيح سوف يظهر لك مربع البحث داخل القالب

كما هو مشار اليه في الصورة التالية

وبعد ظهور صندوق البحث ضع الكود المراد البحث عنه وليكن ]]></b:skin>ونضغط ENTER

وهذه صورة توضيحية بعد وضع الكود داخل مربع البحث وضغط علي الزر ENTER

في أمـــــــــــــــــــــــــــــــــــــــــان الله

تعلم طريقة اضافة آداة متابعة بالبريد الاكتروني

2014-12-01T10:40:00.000-08:00

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

طريقة اضافة آداة متابعة بالبريد الاكتروني

من لــــــــــــــو حة التحكم بلوجر >> تخطيط >> اضافة آداة نختار متابعة بالبريد الاكتروني

الشرح با الصور

وبعد هذه الخطوات اضغط حفظ كما هو موضح في الصورة

ومبروك عليك الاضافة الرائعة

الطريقة الصحيحة لاضافة آخر المواضيع

2014-12-01T04:49:00.000-08:00

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

1- طريقة استخراج رابط التغذية

نذهب الي الرابط التالي myfeeds

بعد الدخول الي الرابط سوف تظهر لك الصور التالية

الرابط الذي بلون الأصفر هو المطلوب نقوم بلحتفاظ به

2- طريقة اضافة أخر المواضيع

من لوحة التحكم بلوجر >> تخطيط اضافة آداة نختار >> التغذية

الشرح با الصور

في المربع كما هو ظاهر في الصورة التالية نقوم با اضافة رابط التغذية لذي استخرجناه في

الخطوة الأولي من الموضوغ ونضعط أستمرار

أضغط حفظ ومبروك عليك الاضافة في امان الله

اضافة ملف Robots.txt المخصص لمدونات بلوجر

2014-11-27T13:16:00.001-08:00

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

طريقة اضافته الي المدونة

1. تسجيل الدخول إلى حساب Blogger الخاص بك والذهاب إلى لوحة المعلومات بلوجر

2. انقر على إعدادات تفضيلات البحث >>

3. تحرير ملف robots.txt مخصص الخاص بك اختيار نعم لتمكين محتوى ملف robots.txt

4. وضع به الكود التالي

User-agent: Mediapartners-Google

Allow:/

User-agent: Googlebot

Disallow: /?m=1

Disallow: /?m=0

Disallow: /*?m=1

Disallow: /*?m=0

User-agent: *

Disallow: /search?*

User-agent: Twitterbot

Allow:/

User-agent: *

Disallow: /search

Disallow: /p/*

Disallow: /view/*

Allow: /

Sitemap: http://cnmot.blogspot.com/feeds/post/default?orderby=UPDATED

غير رابط مدونتي لذي بلون الأحمر الي رابط مدونتك

الطريقة الصحيحة الاضافة مدونتك في جوجل

2014-11-27T08:55:00.000-08:00

تعد جوجل من أهم مصادر الزوار لمدونتك او لموقعك حيث انه اذا اضفت مدونتك لها يمكن الزوار العثور عليك بكل بساطة
وبطريقة سهلة جدا وهي كتابة اسم مدونتك أو موقعك في مربع البحث جوجل العملاق كما ان جوجل تمتلك أكبر محرك بحث في العالم
السؤال المطروح الآن كيف استطيع اضافة مدونتي في جوجل بحيث اذا بحثت عنها أجدها.

هذا ماسنحاول الاجابة عنه في موضوعنا هذا اليوم

الطريقة الصحيحة الاضافة مدونتك في جوجل

اولا سوف نتأكد أن المدونة مرئية لمحركات البحث من لوحة التحكم بلوجر

والآن بعد التأكد من أن المدونة مرئية لمحركات البحث نتقل الي الرابط التالي

أضف عنوان موقعك google

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

الآن قدمنا المدونة الي جوجل لم تتبقي لنا سوي خطوة واحدة وهي تقديم الخريطة

طريقة تقديم خريطة مواضيع مدونتك الي جوجل

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

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

عند الخول الي الرابط مشرفي المواقع سوف تظهر لكم الصور التالية نعمل كما في الصور

عند الضغط علي اضافة موقع سوف تظهرلنا الخانة التالية ضع بها رابط مدونتك من ثم متابعة

عند الضغط علي ملفات السيتماب سوف تظهر الصفحة التالية نضغط اضافة اختبار السيتماب كما هو موضح في الصورة التالية

ونكتب في داخل المربع sitemap.xml

ونضغط تقديم الملف sitemap

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

تغير أستايل المشاركات الشائعة

2014-11-26T11:20:00.001-08:00

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

أولا طريقة اضافتها من لوحة التحكم بلوجر

من لوحة التحكم بلوجر >> تخــــطيط >> اضافة آداة ونختار المشارات الشائعة

الشرح با الصور

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

المهم أنا شرحت لكم طريقة اضافتها أولا

طريقة تغير أستايل المشاركات الشائعة

من لوحة التحكم بلوجر >> قالـــب >> تحرير html >> ونبحث عن الوسم التالي

]]></b:skin>

ونضع فوقه الكود التالي

/*--- cnmot.blogspot.com --- */

.popular-posts ul{padding-left:0;counter-reset:popcount}

.popular-posts ul li:before{list-style-type:none;margin-right:15px;counter-increment:popcount;content:counter(popcount);font-size:16px;background:#292D30;color:#f1f1f1;position:relative;font-weight:700;font-family:georgia;float:left;border:2px solid #f3f3f3;box-shadow:1px 2px 9px #666;padding:.3em .6em}

.popular-posts ul li{border-bottom:1px dashed #ddd}

.popular-posts ul li a:hover{text-decoration:none}

.plugins ul{counter-reset:plugincount;padding:0}

.plugins ul li{border-bottom:1px dashed #ddd;line-height:40px}

.plugins ul li:before{content:counter(plugincount);counter-increment:plugincount;margin-right:15px;background:#292D30;border-radius:25px;border:2px solid #fff;box-shadow:1px 2px 9px #666;color:#fff;font:bold 16px georgia;padding:.3em .6em}

.plugins ul li a:hover{text-decoration:none;color:#2B3033}

.plugins ul li a,.popular-posts ul li a{text-decoration:none;color:#000}

.services{height:129px;width:591px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQ8na93a1RfWCBsrFXE93bXuvKZJ3Jzb4IOyi3LIPrE3sp1eYRSaCtYABtbpNuHqO_4Zko-3WwmghgaBokOfJI1ud8CxT2ch7nL1a_pPDojQsVl0Nda8kBV4PJ2Yx-EZBLxlGZ8sxtkmCX/s1600/gapad2.png) no-repeat scroll -2px 0 transparent;box-shadow:0 3px 4px #666;border-radius:7px;margin:30px 0 0;padding:10px}

.services p{color:#ddd;text-align:justify;text-shadow:1px 1px 2px #000;font-size:13px;font-family:Arial,verdana;line-height:1.6em}

.services p a{color:#666;text-decoration:underline}

.services p a:hover{color:#ddd;text-decoration:none}

.popular-posts ul li:hover,.plugins ul li:hover{border-bottom:1px dashed #696969}

ومن ثم اضغط حفظ القالب وأنتهي الموضوع

طريقة اضافة أرشيف المدونة وتنسيقه

2014-11-26T04:16:00.003-08:00

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

طريقة اضافتها الي مدونتك

من لوحة التحكم بلوجر >> تخطيط >> اضافة اداة >> نختار أرشيف المدونة الالكترونية

الشرح با الصور

الآن قمنا با اضافة أرشيف المدونة الالكترونية الي المدونة

طرية تنسيقها

من لوحة التحكم بلوجر >> قالب >> تحرير html >> ونضغط ctrl+f ونبحث عن الوسم التالي

]]></b:skin>

ونضع فوقه الكود التالي

.BlogArchive .widget-content {margin:0; padding:0;}

.BlogArchive #ArchiveList {height: 142px; overflow: auto;}

.main-inner .widget #ArchiveList {margin: 0; padding:0; border: 1px ridge #999;}

.BlogArchive #ArchiveList ul{margin:0; padding:8px 8px 0 8px;}

.main-inner .widget #ArchiveList ul.flat li {padding:8px 0 8px 0;}

.main-inner .widget #ArchiveList ul.flat li a {font:14px Verdana; text-decoration:none; color:#666;}

ونضغط حفظ القالب

وبهذا يصبح ارشيف المدونة بهذا الشكل

في امان الله ورعايته وأسأل الله عز وجل ان أكون قد وفقت في الشرح

طريقة اضافة قائمة التسميات وتنسيقها

2014-11-25T12:26:00.001-08:00

في موضوعنا اليوم سوف اقدم لكم اضافة من اضافات بلوجر وهي من اشهر الاضافات هي
التسميات او بلمعني الآخر أقسام المدونة تمكن هذه الاضافة الزائر من التنقل بين الأقسام
كما ان هذه الاضافة يمكن تنسيقها وتحكم في عدد الاقسام التي سوف تظهر في هذه الآداة كما يمكن تنسيقها بأي شكل من الأشكال

طريقة اضافتها الي المدونة

من لوحة التحكم بلوجر >> تخطيط >> اضافة آداة >> نختار التسميات

الشرح با الصور

الآن تمت اضافة الأقسام الي المدونة بنجاح

طريقة تنسيقها

من لوحة التحكم بلوجر >> قالب >> تحرير html نضغط ctrl+f ونبحث عن الوسم التالي

]]></b:skin>

ونضع فوقه الكود التالي

.Label li {

background: #EE8A1D !important;

border-radius: 3px 3px 3px 3px !important;

float: right !important;

font-size: 17px !important;

list-style: none outside none !important;

margin: 2px !important;

padding: 10px 10px !important;

transition: all 0.3s ease 0s !important;

}

.Label li:hover {

background: #111 !important;

}

تعديلات بسيطة علي الكود

#EE8A1D:لون الخلفية ويمكن تغيره

17:حجم الخط ويمكنك زيادته او نقصانه

النتيجة في نهاية الشرح

في أمان الله ورعايته