مدونة مصباحي نت

جديد أخبار المدونة

شرح اضافة أيقونات المواقع الإجتماعية فيس بوك , تويتر , جوجل بلس في أي مكان في مدونتك 4

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

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

للحصور على أكواد هذه الإيقونات توجه للصفحات التالية:

Facebook
Google+
Twitter

اكواد الأيقونات التي ستحصل عليها من الروابط أعلى ستعمل عند إضافتها في (single.php) أو (page.php) لكنها لن تعمل بشكل صحيح في رئيسية المدونة (index.php) او (archive.php) لأنها ستظهر عدد الإعجاب أو الريتويت للصفحة نفسها بدلاً عن التدوينات لذا لا بد من تعديل الأكواد التي ستحصل عليها لتلائم الصفحة الرئيسية والإرشيف لو أحببت إضافة هذه الأيقونات

ولكي تقوم بهذا العمل تابع الشرح التالي:

Facebook

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

ستحصل على كودين :
الأول يجب عليك وضعه في ملف (header.php) مباشرة بعد وسم (هذه الكود تحتاج لإضافته فقط مرة واحدة , إذا كنت قد قمت بتركيبه من قبل لإضهار تعليقات الفيس بوك فتجاوز هذه الخطوة)

الثاني ستظيفه في المكان الذي تود ظهوره فيه
لتتاكد من ان الصفحة الموجه في الكود هي الصفحة الصحيحة للموضوع ضع هذا الأمر في الكود href=”ID); ?>”
ليصبح الكود كالتالي
[sourcecode language=’css’]

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

طريقة ربط الأيقونة للرابط الدائم لصفحة او التدوينة أضف هذا الأمر href=”
للكود الذي ستحصل عليه
ليصبح هكذا
[sourcecode language=’css’]

window.___gcfg = {lang: 'ar'};

(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); })();
[/sourcecode]

Twitter

من هذه الصفحة Twitter يمكنك تحديد شكل ومظهر الأيقونة الذي تريده ان يظهر لك في موقعك أو مدونتك

ثم قم بإضافة التعديلات عليه كما في هذا الكود التالي
[sourcecode language=’css’]

وهذه نتيجة التطبيق

يمكنك تاطير الأيقونات كيفما تشاء من ملف style.css

4

أضف تعليق