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

07‏/02‏/2019

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

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

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

مثال للزر داخل المدونة


   اسم الملف
مدونة فوتوماكس حجم الملف 300MB
إذا لم يتم تنزيله تلقائيًا ، فيرجى النقر على إعادة التنزيل. وإذا كان الرابط معطلاً ، فيرجى الإبلاغ عبر صفحة نموذج الاتصال في هذه المدونة.

الآن مع التركيب

ندخل على القالب تم نبحت عن </head>  او &lt;/head&gt;&lt;!--<head/>--&gt;
نضف الكو التالى فوقه


<script type='text/javascript'>
//<![CDATA[
//CSS Ready
function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || "all" }) }
loadCSS("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");
//]]>
</script>

تم نضيف الكود التالى قبل الوسم </head>  او &lt;/head&gt;&lt;!--<head/>--&gt;

<style type='text/css'>
/* Download Counter Box */
#btnx{cursor:pointer;padding:10px 20px;border:0;border-radius:3px;background:#fff;color:#e67e22;float:right;text-transform:capitalize;font-weight:500;transition:all 0.5s}#btnx:hover,#downloadx:hover{background:#d35400;color:#fff;outline:none}.batas-downx{display:block;margin:0 auto;border-radius:4px}.dalam-downx{background:#e67e22;color:#fff;padding:20px;display:block;border-top-right-radius:3px;border-top-left-radius:3px}.file-info{color:#fff;display:inline-block;font-size:1.2em;line-height:38px;text-align:left}.catatan-downx{padding:20px;background:#f7f7f7;border-bottom-right-radius:3px;border-bottom-left-radius:3px;color:#555;font-size:14px}#downloadx{float:right}#downloadx{padding:10px 20px;border-radius:3px;background:#fff;color:#e67e22;float:right;text-align:center;font-size:14px;text-transform:capitalize}.bungkus-info span{display:inline-block;line-height:38px;float:right}.file-deskripsi{display:block}.file-deskripsi span{margin-right:3px}

@media screen and (max-width:640px){.batas-downx{float:none;width:100%}}

@media screen and (max-width:320px){.file-info{display:block;text-align:center}#btnx, a#downloadx{width:100%;margin-bottom:10px}.bungkus-info span{float:none;width:100%;text-align:center}.file-deskripsi{text-align:center}}

</style>

تم نبحت عن هدى الوسم </body> ونضيف الكود التالى فوقه
<script type='text/javascript'>
//<![CDATA[
function generate(){var e,n=document.getElementById("downloadx"),t=document.getElementById("btnx"),a=document.getElementById("downloadx").href,l=10,d=document.createElement("span");n.parentNode.replaceChild(d,n),e=setInterval(function(){--l<0?(d.parentNode.replaceChild(n,d),clearInterval(e),window.location.replace(a),n.style.display="inline"):(d.innerHTML="<i class='fa fa-clock-o' aria-hidden='true'/> File siap diunduh dalam "+l.toString()+" Detik....",t.style.display="none")},1e3)}
//]]>
</script>
نضيف الكود السابق في الموضوع بعد تحويل صندوق الكتابة من وضع التأليف الى وضع HTML 


اضف الكود التالى مع تغيير مايناسب موضوعك


<div class="batas-downx">
<div class="dalam-downx">
<div class="bungkus-info">
<div class="file-info">
اسم الملف
</div>
<button onclick="generate()" id="btnx"><i class="fa fa-cloud-download" aria-hidden="true"></i> download</button>
<a id="downloadx" href="رابط التحميل" style="display:none"><i class="fa fa-cloud-download" aria-hidden="true"></i> download Ulang</a>
</div>
<div class="file-deskripsi">
<span class="uploader"><i class="fa fa-user-circle" aria-hidden="true"></i> Namina Responsive Blogger</span> <span class="file-size"> <i class="fa fa-file" aria-hidden="true"></i>
حجم الملف 300MB</span>
</div>
</div>
<div class="catatan-downx">
إذا لم يتم تنزيله تلقائيًا ، فيرجى النقر على إعادة التنزيل. وإذا كان الرابط معطلاً ، فيرجى الإبلاغ عبر صفحة نموذج الاتصال في هذه المدونة.
</div>
</div>


إقرأ المزيد

27‏/01‏/2019

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

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

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

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


مميزات اضافة كود ميتا تاج بلوجر هذا:

يعمل علي اصلاح اخطاء "أوصاف meta مكررة" و "علامات عناوين مكررة".
تحسين عناوين الصفحات بجميع صفحات المدونة.
انشاء وصف تلقائى مسحوب من محتوي المقالة.
اعداد Social Media Meta Tag facebook and twitter.
تحديد لون مخصص لمتصفحات الجوال.
تهيئة كاملة لـMeta Tag .

والان كيف يمكننا التخلص من تكرار ارشفة المحتوي بروابط مختلفة مثال:

http://www.yoursite.com//2017/08/meta-all-head-content.html?m=0
http://www.yoursite.com/2017/08/meta-all-head-content.html?m=1
http://www.yoursite.com/2017/08/meta-all-head-content.html?showComment
http://www.yoursite.com/2017/08/meta-all-head-content.html?fb_comment_id


 خطوات التركيب

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

اذهب الى موقعك 
اضغط على قالب 
تحرير HTML
ابحث عن هذا الكود داخل القالب

<b:include data='blog' name='all-head-content'/>
 فى حال انك وجدت هذا الكود معناه ان قالبك به خاصية عدم تكرار الروابط بروابط مختلفة, اما فى حال عدم ايجاده قم باضافة الكود التالى بعد </head>
<link rel='canonical' expr:href='data:blog.url'/>
 وبهذا سيعود جوجل لارشفة موقعك لكن بطريقه افضل وخلال 20 يوم ستلاحظ بفرق وانخفاظ فى عدد الروابط والاوصاف المتكرره



إقرأ المزيد