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

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

معاينة اضغط هنا

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

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

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

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

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

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

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

وبعدها تضغط علي عرض 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 لأن ذلك سيؤثر على تجربة الزوار ويؤثر على وظيفة الأسكربت بشكل كامل.

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

الخطوة الثانية - إضافة بعض أكود CSS وجافا سكريبت

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

يرجى تعديل القالب الخاص بك في وضع "تحرير 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> في قوالب معينة ، بدلاً من ذلك يمكنك البحث عن كود مثل هذا: </head> أو </head>

التحويل من نسخة الموبيل?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 ، بعد إضافة البرنامج النصي أدناه ، سيتم تشفير جميع الروابط الخارجية تلقائيًا كما في المثال أدناه

https://imintweb.com/p/redirect.html?url=aHR0cH6Ly9M3d3c2NS56aXBeXNoYXwJlLbmNvS92L3F3V1FhTDdWL2ZpbGUuaHRtbA

أسهل طريقة لوضع كود جافا سكريبت هي وضعها قبل الوسم </body>. ابحث عن الوسم عادةً ستجده في الجزء السفلي من القالب والصق كود جافا سكريبت التالي أدناه مباشرةً قبل الوسم </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>

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

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

يعمل كود <b:if cond='data:view.isSingleItem'> عل جعل سكربت صفحة إعادة توجيه الروابط الخارجية داخل التدوينات فقط وليس علي مستوي المدونة

بعد الأنتهاء من إضافة جميع الأكواد قم بحفظ القالب

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

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

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" ];

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

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