-->

تقنية ، إنترنت ، برامج ، إسلامية ، إقتصادية ، إجتماعية ، تعليمية ، رياضية

سُبْحَانَ اللَّهِ وَبِحَمْدِهِ ... سُبْحَانَ اللَّهِ العَظَيم

الأحد، 17 أغسطس 2014

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

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

 وسم ALT : هو عبارة عن سطر نقوم بإضافته بعد عنوان الصورة داخل كود html، لوضع اسم للصورة.

فوائد استخدام كود إضافة وسم ALT تلقائياً :

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

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

شرح تفصيلي لطريقة التركيب  بالنسبة لمحرر بلوجر  الحديث

1- ندخل الى لوحة تحكم المدونة .  

 2- نضغط على كلمة  قالب  من القائمة الجانبية   مثل الصورة التالية :





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




 ومن  تلك الصورة السابقة نضغط على تحرير   HTML    ، لكي يظهر لنا الصورة التالية:  


3- نبحث عن الكود التالي (اضغط على CTRL + F من الكيبورد لظهور عملية البحث ):
</body>
4 - بعد أن نجد الكود السابق  نضع الكود التالي فوقه مباشرة :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<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>
مع ملاحظة الآتي :
* السطر الملون بالأحمر يتم إضافته في حالة إذا لم يكن موجودا داخل كود HTML الخاص بمدونتك، ويتم تجاهله إذا  كان موجودا أي يتم إضافة الكود السابق بدونه .

5- ثم نضغط على   حفظ  النموذج  لحفظ التغيرات .

جزى الله خيرا كل من ساهم فيه

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

إرسال تعليق