حصرياٌ كود لوضع اوسمة علي الصور تلقائيا من عنوان التدوينة

وضع الاوسمة علي الصور من اهم الاشياء التي يجب مراعاتها عند كتابة تدوينة جديدة لتحسين وضع السيو الخاص بمدونتك و تحسين ظهور صورك في نتائج البحث عن الصور .
اليوم اتيت  لكم باكواد لوضعها في مدونتكم لتقوم بعمل  الاوسمة علي الصور تلقائياً
طريقة تركيب الكود :
اذهب الي لوحة تحكم بلوجر > ثم الي القالب > ثم الي تحرير html
ابحث عن الوسم  </body>  عن طريق الضغط علي ctrl +f.
ضع الكود التالي قبلة مباشرتاُ:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
//SEO SCRIPT POWERED BY www.alltechbuzz.in
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
$('img').each(function(){
var $img = $(this);
var filename = $img.attr('src')
$img.attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));

$img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
});
});
//]]>
</script>>

قم بحفظ القالب
و ستجد اسم الصورة أي الوسم موجودا في كل التدوينات الجديدة تلقائيا.

الدرس الاول في سلسلة دروس دورة السيو : مقدمة عن السيو

الكثير منا يسمع عن كلمة السيو يتمني ان يعرف معناها seo  هي اختصار ل   search engine optimization
اول شيئ يجب ان نعرفة هو ان السيو  يختلف عن الاشهار .
الدرس الاول في سلسلة دروس دورة السيو : مقدمة عن السيو

ٌالسيو :
يختص فقط بمحركات البحث .
ٌ الاشهار
يزيد من عدد زوار موقعك او مدونتك عن طريق الدعاية من خلال البنرات و مواقع التواصل الاختماعي و غيرها.

و من رأيي ان السيو اهم بكثير من الاشهار لانة بنسبة 90% من مستخدمي محركات البحث لا ينظرون الا الي اول 3 مواقع في نتيجة البحث فاذا ما حسنت موقع مدونتك  في نتيجة البحث ستحصل علي عدد كبير جداً من الزوار.

ٌ كيف تعرف ان كانت مدونتك جاهزة للتعامل مع محركات البحث ام لا ؟
_1_  اذا كنت تستخدم قالب فلاشي .
فعلم ان جوجل و جميع محركات البحث لن تستطيع ارشفة موقعك لانها في عمليات البحث تنظر الي كلمات متطابقة او  تركيبة من الكلمات و الان قلي اين يستطيع ايجاد ذلك في الصور الفلاشية .
_2_ الاكتفاء بالرسوم في الهيدر .
الايكتفاء الرسوم في الهيدر يبدو جميلاً في البداية و لكن سيئا من ناحية اخري مهم جداً عدم الاكتفاء بالوجو الخاص بمدونتك و وضع الوصف الكامل لها في الهيدر ليزيد ذلك من  عدد الزوار h2 حيث ان النصوص هي التي ينظر اليها محركات البحث لا الرسوم .
_3_ الاهتمام الكثير بالصور في الموضوعات .
اذا كانت الموضوعات لا تحتاج للكثير من الصور فلا تكثر منها لكن من الممكن اضافة صوره واحدة او اثنتين لاطفاء لمسة من الجمال علي المشاركة .لكن لا تكتفي بالصور او كتابة النصوص علي الصور بالفوتوشب و غيرة ...
_4_قلة الكلمات الدليلية ...
يجب عليك لتحسين موقعك في نتائج البحث وضع الكلمات الدليلية صحيحة لانها من اهم ما ينظر الية عناكب الارشفة و الاهتمام بالصحة الاملائية للكلمات و الابتعاد عن استخدام اللغة الدارجة او العمية في انتقاء الكلمات .




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

اضافة ازرار المواقع الاجتماعية شبيهة بواجهة مترو الخاصة بوندز 8


اضافة ازرار المواقع الاجتماعية شبيهة بواجهة مترو الخاصة بوندز 8 


ازرار مواقع التواصل الاجتماعي شبيهة بواجهة مترو


اذهب الى التخطيط 
>> اضافة اداة >> اختر HTML/JavaScript

<div class="metro-social">
<li><a class="fb" href="ضع هنا رابط صفحتك علي فيس بوك"></a></li>
<li><a class="tw" href="ضع هنا رابط صفحتك علي تويتر"></a></li>
<li><a class="gp" href="ضع هنا رابط صفحتك علي جوجل"></a></li>
<li><a class="fd" href="ضع هنا رابط صفحتك علي فييد"></a></li>
</div>
<style>
/*Metro UI Social Profile Widget v2.0 by Tech Prevue Labs
Web link to gadget code: http://www.techprevue.com/2013/02/social-profile-gadget-metro-style.html
Distributed under license CC BY-NC-ND 3.0 INT
Please keep license information intact while using this widget*/
.metro-social{width:285px}
.metro-social li{position:relative;cursor:pointer;padding:0;list-style:none}
.metro-social .fb,.tw,.gp,.fd{z-index:7;float:left;margin:1px;position:relative;display:block}
.metro-social .fb{background:url(//goo.gl/6xmUk) no-repeat center center #1f69b3;width:140px;height:141px}
.metro-social .tw{background:url(//goo.gl/oyiFK) no-repeat center center #43b3e5;width:140px;height:70px}
.metro-social .gp{background:url(//goo.gl/oT0kF) no-repeat center center #da4a38;width:140px;height:69px}
.metro-social .fd{background:url(//goo.gl/ncoLY) no-repeat center center #e9a01c;width:282px;height:69px}
.metro-social li:hover .fb{background:url(//goo.gl/MH8AP) no-repeat center center #1f69b3}
.metro-social li:hover .tw{background:url(//goo.gl/hHRHv) no-repeat center center #43b3e5}
.metro-social li:hover .gp{background:url(//goo.gl/wva4B) no-repeat center center #da4a38}
.metro-social li:hover .fd{background:url(//goo.gl/JFGqn) no-repeat center center #e9a01c}
</style>
<br>

جميع المواقع الهامه التى يحتاج اليها المصمم للحصول على كل لوازم التصميم

 جميع المواقع الهامه التى يحتاج اليها المصمم للحصول على كل لوازم التصميم

مواقع للفرش 








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

اضافة رائعة لمدونتك ازرار تابعونا علي فيسبوك , rss , تويتر , delicious , youtube بشكل رائع سدادات تقفز من  داخل سلة
الان ناتي للشرح
1.انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHtml, ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.
قم بالبحث عن الكود التالي :لا تنسى أن تأخد نسخة إحتياطية لمدونتك تجنبا لأي أخطاء.
                                                                                                  ]]></b:skin>
2.ثم قم بلصق هذا الكود  قبله :
.stack {
position: fixed;
bottom: -5px; right: 940px; }
.stack > img { position: relative;
cursor: pointer;
padding-top: 28px;
z-index: 2;
}
.stack ul { list-style: none;
position:absolute;
top: 5px;
cursor: pointer; z-index: 1;
}
.stack ul li { position: absolute;
}
.stack ul li img { border: 0;
}
.stack ul li span { display: none;
}
.stack .openStack li span { font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
display:block;
height: 0px;
position:absolute;
top: 17px;
right:60px;line-height: 14px;border: 0;background-color:transparent;padding: 0px 0px;
border-radius: 10px;-webkit-border-radius: 0px;
-moz-border-radius: 0px;color: #4F3939;text-align: center;
text-shadow: #000 1px 1px 1px;opacity: .85;filter: alpha(opacity = 85);
}/* IE Fixes */.stack { _position: absolute; }.stack ul { _z-index:-1; _top:-15px; }.stack ul li { *right:5px; }
يمكنك تبديل القياسات ذات اللون الأحمر لإختيار موضع الأداة في مدونتك .
3.انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ثم إضافة أداة ثم اختر HTML/Javascriptولآن الصق الكود التالي :
<div class="stack">
<img alt="stack" src="http://nettuts.s3.amazonaws.com/082_leopard2/preview/images/stack.png" ilo-full-src="http://nettuts.s3.amazonaws.com/082_leopard2/preview/images/stack.png" /><ul id="stack">

<li><a href="ضع رابط الفيس بوك هنا"><span></span><img alt="Facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMnZZD0s4Yyh2ewrn3kVGR5Xk54ql6GH7FoelnpKWAKbXgOjuaTVBMkV4AqO_lAVKh-i3QpW08mZLKVgQSa2VfnBY-8Bm4MFMOMbF39kIKUZHlOcMehAi7sLW2XI0gMTLzwrJFAJppExo/s320/facebook.png" ilo-full-src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMnZZD0s4Yyh2ewrn3kVGR5Xk54ql6GH7FoelnpKWAKbXgOjuaTVBMkV4AqO_lAVKh-i3QpW08mZLKVgQSa2VfnBY-8Bm4MFMOMbF39kIKUZHlOcMehAi7sLW2XI0gMTLzwrJFAJppExo/s320/facebook.png" /></a></li>

<li><a href="ضع رابط الفييد هنا "><span></span><img alt="RSS" src="http://www.trables.com/social_images/rss.png" ilo-full-src="http://www.trables.com/social_images/rss.png" /></a></li>

<li><a href="ضع رابط قناتك علي يوتيوب هنا"><span></span><img alt="youtube" src="https://easyjet.custhelp.com/euf/assets/images/youtube.png" ilo-full-src="https://easyjet.custhelp.com/euf/assets/images/youtube.png" /></a></li>

<li><a href="ضع رابط تويتر هنا"><span></span><img alt="technorati" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiz-eyZAuWRRgeNedaA4KpeTOn7xazT32Mu1E-MoVHAbt7FZNuu1xmm9GX1ky1HARVsxjrNFM1FHctabR12Wvi_VB60AclyrTABx0E-HaTMwPWtPfMDK9fTSw6onqdUPNC3DcHl-SiK9Ak/s320/twitter.png" ilo-full-src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiz-eyZAuWRRgeNedaA4KpeTOn7xazT32Mu1E-MoVHAbt7FZNuu1xmm9GX1ky1HARVsxjrNFM1FHctabR12Wvi_VB60AclyrTABx0E-HaTMwPWtPfMDK9fTSw6onqdUPNC3DcHl-SiK9Ak/s320/twitter.png" /></a></li>



<li><a href="رابط الدلسيوز هنا"><span></span><img alt="delicious" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeGOUBhyupVGw58jYetFQDMX0f53g23IPaP91LAvXQp2ae2-WVNngbaolwd0fIrrCT6AF6JHeK64lmjJ5mVjBS4zbn3LfljiwvouJcdSDvbP0VMAU_UEowUadg5qwk5FEbXdrNnkZ_77I/s320/delicious.png" ilo-full-src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeGOUBhyupVGw58jYetFQDMX0f53g23IPaP91LAvXQp2ae2-WVNngbaolwd0fIrrCT6AF6JHeK64lmjJ5mVjBS4zbn3LfljiwvouJcdSDvbP0VMAU_UEowUadg5qwk5FEbXdrNnkZ_77I/s320/delicious.png" /></a></li></ul></div>

<!-- end div .stack --><script src="https://sites.google.com/site/mohamedabuiyad/button/jquery.min.js" type="text/javascript"></script><script src="https://sites.google.com/site/mohamedabuiyad/button/fisheye-iutil.min.js" type="text/javascript"></script>

<span ><a href="http://www.monte-escalier-prix.org/" target="_blank"></a></span>
لا تنسى تبديل الروابط ذات اللون الأحمر بالروابط الخاصة بك .
1.رابط صفحة الفيسبوك لديك
2.رابط الخلاصات RSS
3.رابط قناتك الخاصة على التويتر
4.رابط التويتر
5.رابط الدلسيوز
ليس شرطا أن تكون لديك جميع هذه الروابط حتى تقوم بإضافتها ،يمكنك التحكم في عدد الأزرار 

حصرياً : قالب Skyblue الرائع معرب لعشاق التميز

Skyblue Blogger template
قالب انيق و صديق لمحركات البحث معرب 
يحتوي القالب علي طريقة عرض فريدة شبيهة لواجهة مترو الخاصة بوندز 8 
مميزات القالب :
1 - جميل المظهر
2 - سهل التعديل 
3 - يحتوي علي اضافات رائعة 
4 - امكانية وضع اعلانات او ادوات في الهيدر ...و هذه الخاصية تزيد من ارباحك في جوجل ادسنس ان كنت من مستخدمي جوجل 
5 - القالب معرب بالكامل 
صور من القالب

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

الان ناتي الي تحميل القالب 
لا ابيح ازالة حقوق التعريب نهائياً
للحصول علي المزيد من الاضافات الرائعة من اجل مدونتك 
تفضل بزيارة قسم الاضافات