إعلان علوي

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

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


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


ميزات صفحة إعادة التوجيه لمدونة بلوجر

الطريقة التي يعمل بها هذا البرنامج النصي هي نفسها تقريبًا في جميع البرامج النصية أو الصفحات الأخرى مثل Seo Plus أو قالب Squeeze أو ما شابه ، وهو أنه عندما ينقر زائر الموقع على رابط خارجي لموقع ما ، سيعمل البرنامج النصي ويحوله إلى صفحة تنتظر بعض الوقت ثم تضغط على زر إنشاء رابط ثم الإنتقال إلى الرابط وهذا مفيد جدًا لموقعك حيث سيؤدي ذلك إلى تقليل معدل الإرتداد للموقع وزيادة أرباح Adsense من الإعلانات.

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

  • لا تحتاج إلى شراء مجال جديد أو إنشاء مدونة بلوجر جديدة
  • تخصيص أسهل
  • ستحتفظ بالمدونة الرئيسية ، مما يعني أن عدد زوار المدونة الرئيسية سيزداد تلقائيًا
  • زيادة تصنيفات المدونات بسبب زيادة عدد الزوار
  • تقليل معدل ارتداد المدونة
  • طريقة لوضع إعلانات AdSense لزيادة أرباح المدونة
  • 100٪ آمن لأنه لا يزال في نفس المجال مثل المدونة الرئيسية

عيب صفحة إعادة توجيه Blogger هذه أنها ستحول جميع الروابط الخارجية إلى موقعك ، بما في ذلك مشاركة الروابط على مواقع التواصل الاجتماعي أو روابط إلى مدونات أخرى ، لكن حل هذه المشكلة بسيط وهو وضع جميع الروابط التي لا تريد أن يعمل معها البرنامج النصي في قائمة الاستبعاد لصفحة "الأداة" التي توجه الارتباطات على المدونة ، (سيتم شرح هذا الجزء أيضًا).

كيفية إضافة صفحة إعادة توجيه الروابط الخارجية

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

الخطوة الأولى - إنشاء صفحة روابط إعادة التوجيه

أولاً ستقوم بإنشاء صفحة على مدونتك وسنفترض أنك تعرف كيفية إنشاء صفحة ومن ثم ستضغط على الأيقونة ثم تضغط على عرض HTML

ثم ستضع الكود التالي في هذه الصفحة بعد النقر على HTML:

<div class='ad-placement'>
  <!--[ ضع كود الأعلانات هنا ]-->
</div>

<div class='safelink-button' id='safelink'>
  <div style='text-align: center'>
    <div class='button outline' id='safelink-wait'>برجاء الأنتظار...</div>
    <script>/*<![CDATA[*/ var currentURL = location.href; var str = currentURL; var res = str.replace('https://your_blog_address.com/p/redirect-page.html' + '?url=', " "); function changeLink(){ var decodedString = Base64.decode(res); window.open(decodedString, '_blank')}; document.write('<a href="#getLink" id="safelink-download" class="button">إنشاء الرابط</a>'); var linkDL = document.getElementById("safelink-download"); var notif = document.getElementById("safelink-wait"); var time = 5; var textTime = document.createElement("span"); linkDL.parentNode.replaceChild(textTime, linkDL); var id; id = setInterval(function () { time--; if (time < 0) { textTime.parentNode.replaceChild(linkDL, textTime); clearInterval(id); notif.style.display = "none"; linkDL.style.display = "inline-block"; } else { textTime.innerHTML = "سيظهر الرابط الخاص بك خلال " + time.toString() + " ثانية"; }}, 1000); /*]]>*/</script>
  </div>
</div>

<div class='safelink-content'>

  <!--[  هنا تقوم بوضع محتوي الصفحة ]-->

</div>

<div class='safelink-create' style='text-align:center'>
  <div class='ad-placement'>
    <!--[ ضع كود الأعلانات هنا ]-->
  </div>

  <div id='getLink'>
    <a class='button' href='javascript:;' onclick='changeLink();' rel='noreferrer noopener' target='_blank'>الذهاب إلي الرابط</a>
  </div>

  <div class='ad-placement'>
    <!--[ ضع كود الأعلانات هنا ]-->
  </div>
</div>

التعديلات:

  • قم بتغيير الجزء المحدد من المثال الذي ستضعه على صفحة تحويل الروابط ، وكذلك ضع الإعلانات في المساحة المتوفرة بالأحجام المناسبة
  • غيّر https://your_blog_address.com/p/redirect-page.html بالرابط المؤدي إلى الصفحة التي أنشأناها قبل الوصول إلى هذه الخطوة.
  • يمكنك أيضًا تغيير النصوص التي تم تمييزها على أنها إنشاء رابط أو الانتقال إلى الرابط والنصوص الأخرى المحددة
  • الرقم 5 في الكود أعلاه هو الوقت (بالثواني) لعرض رابط الوجهة ، يمكنك تغييره ليكون أسرع أو أبطأ. يمكنك أيضًا تخصيص نص الوقت الذي يظهر عن طريق تغيير قسم "سيظهر الرابط في القسم الثاني".
  • من المستحسن أن تدعم مدونتك https لأن هذا سيؤثر على تجربة الزوار ويؤثر على وظائف البرنامج النصي تمامًا.

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

الخطوة 2 - أضف بعض أكواد CSS و JavaScript


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


يرجى تعديل النموذج الخاص بك في وضع "تحرير HTML" ، باختصار الرجاء النقر فوق المظهر والنقر فوق تعديل HTML كما هو موضح في الصورة أدناه ؛ أنت بحاجة إلى نسخ القالب احتياطيًا أولاً لتجنب أخطاء التحرير.

أضف أكواد CSS

يعمل رمز css هذا على تنسيق صفحة توجيه الروابط التي أنشأناها أعلاه:

/* redirect page */
:root {
--link-outline-color: #48525c ;
--link-bg-color: #204ecf ; // لو خلفية زر الرابط
}

.button{display: inline-flex;align-items: center;margin: 15px 15px;padding: 10px 20px;outline: 0;border: 0;border-radius: 2px;color: #fefefe;background-color: var(--link-bg-color);font-size: 14px;white-space: nowrap;overflow: hidden;max-width: 100%;line-height: 2em}
.button.outline{color: var(--link-outline-color);background-color: transparent;border: 1px solid #ebeced}
.button.outline:hover{border-color: var(--link-bg-color)}
.safelink-button, .safelink-create > *{margin: 1.8em 0}
.safelink-button span{display: block;font-size: 12px}
#getLink{margin: 5px 0}
#getLink .button{display: none}
#getLink:target .button{display: inline-flex}

يمكنك تعديل هذا القسم مثل تغيير حجم النص على الروابط وما إلى ذلك.

في Blogger ، يتم تمييز كود CSS بـ <b: skin> ... </ b: skin>. إذا كان من الصعب وضع كود CSS أعلاه ، فيمكنك البحث عن </head> ووضع كود CSS مباشرةً فوق كود </head> مع ملاحظة أنه يجب عليك استخدام <style> ... </style>. ستكون النتيجة مشابهة لما يلي:

:
  <style>
    <!--[ تقوم هنا بوضع كود css أعلاه ]-->
  </style>
</head>

أحيانًا لا يتم العثور على الكود </head> في قوالب معينة ، بدلاً من ذلك يمكنك البحث عن كود مثل هذا: &lt;/head&gt; أو &lt;!--<head/>--&gt;&lt;/head&gt;

التحويل من النسخة المحمولة?m=1

ابحث عن علامة </head> في مدونتك وضع الشفرة أدناه أعلى العلامة </head> مباشرةً:

<b:if cond='data:view.isPage'>
  <script>/*<![CDATA[*/ var uri = window.location.toString(); if (uri.indexOf("?m=1","?m=1") > 0) {var clean_uri = uri.substring(0, uri.indexOf("?m=1"));window.history.replaceState({}, document.title, clean_uri); }; var protocol = window.location.protocol.replace(/\:/g,''); if(protocol == 'http'){ var url = window.location.href.replace('http','https'); window.location.replace(url);} /*]]>*/</script>
</b:if>

يزيل الرمز أعلاه الرمز &m=1 الذي يظهر عادةً عند الوصول إلى الصفحة عبر الهاتف المحمول ، لأنه إذا لم تتم إزالة الرمز &m=1 ، فلن تعمل صفحة تحويل الرابط عند وصول الزوار إليها عبر منصات مختلفة للجوّال. يعيد هذا الرمز أيضًا توجيه الزائرين من "http" إلى "https". إذا لم يتم تعيين مدونتك لدعم "https" ، فيمكنك حذف الجزء المظلل بالألوان في الكود أعلاه:

var protocol = window.location.protocol.replace(/\:/g,''); if(protocol == 'http'){ var url = window.location.href.replace('http','https'); window.location.replace(url);}

انتباه
لن تعمل المدونة التي تستخدم بروتوكول "Http" فقط إذا تم الوصول إليها عبر بروتوكول "Https"


ترميز URL

يغير هذا البرنامج النصي جميع الروابط الخارجية على المدونة إلى Base64 ، بعد إضافة البرنامج النصي أدناه ، سيتم تشفير جميع الروابط الخارجية تلقائيًا.

أسهل طريقة لوضع شفرة JavaScript هي وضعها قبل علامة </body>. ابحث عن العلامة. ستجده عادةً في الجزء السفلي من النموذج وقم بلصق رمز JavaScript التالي قبل علامة </body> مباشرةً:

<b:if cond='data:view.isSingleItem'>
  <script>/*<![CDATA[*/ var Base64 = {_keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789", encode: function (input) {var output = ""; var chr1, chr2, chr3, enc1, enc2, enc3, enc4; var i = 0; input = Base64._utf8_encode(input); while (i < input.length) {chr1 = input.charCodeAt(i++); chr2 = input.charCodeAt(i++); chr3 = input.charCodeAt(i++); enc1 = chr1 >> 2; enc2 = ((chr1 & 3) << 4) | (chr2 >> 4); enc3 = ((chr2 & 15) << 2) | (chr3 >> 6); enc4 = chr3 & 63; if (isNaN(chr2)) {enc3 = enc4 = 64;} else if (isNaN(chr3)) {enc4 = 64;} output = output + this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) + this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);} return output; }, decode: function (input) {var output = ""; var chr1, chr2, chr3; var enc1, enc2, enc3, enc4; var i = 0; input = input.replace(/[^A-Za-z0-9\+\/\=]/g, ""); while (i < input.length) {enc1 = this._keyStr.indexOf(input.charAt(i++)); enc2 = this._keyStr.indexOf(input.charAt(i++)); enc3 = this._keyStr.indexOf(input.charAt(i++)); enc4 = this._keyStr.indexOf(input.charAt(i++)); chr1 = (enc1 << 2) | (enc2 >> 4); chr2 = ((enc2 & 15) << 4) | (enc3 >> 2); chr3 = ((enc3 & 3) << 6) | enc4; output = output + String.fromCharCode(chr1); if (enc3 != 64) {output = output + String.fromCharCode(chr2);} if (enc4 != 64) {output = output + String.fromCharCode(chr3);} } output = Base64._utf8_decode(output); return output;}, _utf8_encode: function (string) {string = string.replace(/\r\n/g, "\n"); var utftext = ""; for (var n = 0; n < string.length; n++) {var c = string.charCodeAt(n); if (c < 128) {utftext += String.fromCharCode(c);} else if ((c > 127) && (c < 2048)) {utftext += String.fromCharCode((c >> 6) | 192); utftext += String.fromCharCode((c & 63) | 128);} else {utftext += String.fromCharCode((c >> 12) | 224); utftext += String.fromCharCode(((c >> 6) & 63) | 128); utftext += String.fromCharCode((c & 63) | 128); }} return utftext;}, _utf8_decode: function (utftext) {var string = ""; var i = 0; var c = c1 = c2 = 0; while (i < utftext.length) {c = utftext.charCodeAt(i); if (c < 128) {string += String.fromCharCode(c); i++;} else if ((c > 191) && (c < 224)) {c2 = utftext.charCodeAt(i + 1); string += String.fromCharCode(((c & 31) << 6) | (c2 & 63)); i += 2;} else {c2 = utftext.charCodeAt(i + 1); c3 = utftext.charCodeAt(i + 2); string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63)); i += 3;}} return string; }}; var protected_links = ""; var a_to_va = 0; var a_to_vb = 0; var a_to_vc = ""; function auto_safelink() {auto_safeconvert();}; function auto_safeconvert() {var a_to_vd = window.location.hostname; if (protected_links != "" && !protected_links.match(a_to_vd)) {protected_links += ", " + a_to_vd;} else if (protected_links == "") {protected_links = a_to_vd;} var a_to_ve = ""; var a_to_vf = new Array(); var a_to_vg = 0; a_to_ve = document.getElementsByTagName("a"); a_to_va = a_to_ve.length; a_to_vf = a_to_fa(); a_to_vg = a_to_vf.length; var a_to_vh = false; var j = 0; var daftarPostingan = [ "https://your_blog_address.com/p/redirect.html" ]; var randomPostingan = daftarPostingan[Math.floor(Math.random()*daftarPostingan.length)]; var a_to_vi = ""; for (var i = 0; i < a_to_va; i++) {a_to_vh = false; j = 0; while (a_to_vh == false && j < a_to_vg) {a_to_vi = a_to_ve[i].href; if (a_to_vi.match(a_to_vf[j]) || !a_to_vi || !a_to_vi.match("https")) {a_to_vh = true;} j++; } if (a_to_vh == false) {var encryptedUrl = Base64.encode(a_to_vi); a_to_ve[i].href = randomPostingan + "?url=" + encryptedUrl; a_to_ve[i].rel = "noopener noreferrer"; a_to_vb++; a_to_vc += i + ":::" + a_to_ve[i].href + "\n";} } var a_to_vj = ""; var a_to_vk = ""; if (a_to_vj) {a_to_vj.innerHTML += a_to_vb;} if (a_to_vk) {a_to_vk.innerHTML += a_to_va;} }; function a_to_fa() {var a_to_vf = new Array(); protected_links = protected_links.replace(" ", ""); a_to_vf = protected_links.split(","); return a_to_vf;}; /*]]>*/</script>

  <!--[ الروابط المحمية من صفحة إعادة التوجيه ]-->
  <script>protected_links = "facebook.com, instagram.com, twitter.com"; auto_safelink(); </script>
</b:if>

قم بتغيير الرابط المحدد في الكود السابق أعلاه بالرابط إلى الصفحة التي أنشأناها في بداية الشرح.

بشكل افتراضي ، سيتم توجيه جميع الروابط الخارجية إلى صفحة إعادة التوجيه ، وإضافة بعض مواقع الإستبعاد مثل صفحة facebook في مدونتك وما إلى ذلك في قسم "الروابط المحمية من صفحة إعادة التوجيه" ، وفصل بينها بفاصلة (،) إذا كنت ترغب في إضافة بعض المواقع في الإستثناءات.

بعد الإنتهاء من إضافة جميع الرموز ، احفظ القالب.

إضافة أكثر من صفحة إعادة توجيه الروابط

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

var daftarPostingan = [ "https://your_blog_address.com/p/redirect.html" ];

أضف عنوان url جديدًا مفصولًا بفاصلة (،) بحيث يبدو الرمز هكذا ؛ يمكنك أيضًا إضافة بعض صفحات التوجيه الأخرى:

var daftarPostingan = [ "https://your_blog_address.com/p/redirect.html", "https://your_blog_address.com/p/redirect-2.html" ];

هذا الجزء اختياري بحيث لا تحتاج إلى إضافته ، يمكنك أن ترضى بالعمل على صفحة واحدة.

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

تم تحديث هذه المقالة لتسهيل استخدامها واختبارها على المدونات الأخرى ، فهي تعمل بنسبة 100٪ ، إذا كنت لا تزال تجد أخطاء ، فقد يكون هناك خطأ ما في تنفيذ التعليمات البرمجية.

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








 

تحميل برنامج إستعادة الصور والفيديوهات بنقرة واحدة