مرحبا بكم أعزائي الكرام...! كيف حالكم ؟؟
جئتكم اليوم وبعد غياب طويل بإضافة جديدة تتعلق بإنشاء صفحة إعادة توجية الروابط الخارجية في مدونتك، حيث تعتبر من المميزات التي تطيل مدة بقاء الزائر في مدونتك (أو موقعك) لأطول مدة ممكنة، وطبعا صفحة توجيه الروابط هي مفيدة لزيادة الأرباح بشكل كبير وزيادة نسبة الضغط على الاعلانات بطريقة شرعية، والأمر لا يتعلق بإعلانات أدسنس فقط، بل ويمكنك استغلال الطريقة أيضا مع شركة اعلانية أخرى تتعامل معها، وإلى جانب الزيادة في الأرباح فبفضل هذه الإضافة سيزيد أيضا معدل عدد مشاهدات الصفحات على مدونتك و بالتالي تخفيض ترتيب اليكسا وتحسين مدونتك على محركات البحث، لذلك أصبحت صفحة تحويل الروابط مهمة جدا لكل مالك موقع او مدونة.
وبما أنني لم أتطرق لهذه الإضافة من قبل ولم أضف أي تدوينة تتعلق بها، فكرت أنها ستفيد مجموعة من مشاهدي هذا المقال....، إلى هنا ثنتثهي المقدمات ولنتطرق لطريقة إضافة هذه الأخير على مدونتكم، فلنباشر الشرح :
قم بإنشاء صفحة إعادة توجيه الروابط من خلال الخطوات التالية :
مراحل تركيب الإضافة
- أدخل إلى لوحة تحكم المدونة في بلوجر.
- إختر قالب المدونة التي تود تطبيق الشرح فيها.
- أضف صفحة جديدة بعنوان فليكن على سبيل المثال redirect
- إضغط على HTML الخاص بالصفحة ثم قم بحذف كل شيء (إذا لم يكن المحتوى فارغا) وأضف الكود التالي:
<div>
<!-- يمكن إضافة الوصف هنــــــــــــا -->
</div>
<div id="pageredirect"></div>
<style>
.mCont { height: 250px; width: 250px; margin: 0 auto; text-align: center; border-radius: 100%; border: 20px solid #f8f8f8; position: relative; border-bottom-color: transparent }
.two { display: flex; align-items: center; text-align: center; justify-content: center; height: 100%; font-size: 80px; position: relative; top: -8px; font-weight: bold;}
.border1 { position: absolute; top: -20px; left: -20px; right: -20px; width: 250px; height: 250px; border: 20px solid transparent; border-radius: 50%; border-bottom-color: #4267b2 }
.border2 { position: absolute; top: -20px; left: -20px; right: -20px; width: 250px; height: 250px; border: 20px solid transparent; border-radius: 50%; border-bottom-color: #4267b2 }
.border3 { position: absolute; top: -20px; left: -20px; right: -20px; width: 250px; height: 250px; border: 20px solid transparent; border-radius: 50%; border-bottom-color: #4267b2 }
.border4 { position: absolute; top: -19px; left: -20px; right: -20px; width: 250px; height: 250px; border: 20px solid transparent; border-radius: 50%; border-bottom: 23px solid #fff }
.zr { position: absolute; bottom: -10px; right: 0; left: 0; z-index: 999999; border-style: solid; border-width: 5px; border-color: rgba(0, 0, 0, 0.03); display: inline-block; background-color: #f8f8f8; padding: 5px 15px; width: 160px; font-size: 14px; margin: 0 auto; border-radius: 50px; color: #d2d2d2 !important; text-decoration: none }
.run { cursor: progress }
.act { cursor: pointer; color: #3c5b92 !important; border-color: rgba(44, 130, 201, 0.48); border-style: double; transition: all .3s }
a.zr.act:hover { border-color: rgba(44, 130, 201, 0.48); background: rgba(44, 130, 201, 0.74); color: #fff !important }
.dis { cursor: no-drop; background-color: #ffcfcf; color: #de6262 !important }
</style>
<script>
//<![CDATA[
b4_arr={'timer' : '10',
'text-err' : 'الرابط معطل !',
'text-ready' : 'الرابط جاهز',
'text-Configure' : 'جاري تهيئة الرابط';
var rConfigure = void 0 !== b4_arr["text-Configure"] ? b4_arr["text-Configure"] : "جاري تهيئة الرابط",
rReady = void 0 !== b4_arr["text-ready"] ? b4_arr["text-ready"] : "الرابط جاهز",
rError = void 0 !== b4_arr["text-err"] ? b4_arr["text-err"] : "رابط معطل",
rTimer = void 0 !== b4_arr.timer ? b4_arr.timer : "5",
rUrl = "false";
$firstBorder = 0, rTimer <= 6 && (rTimer = 6), $pageredirecthtml = "<div class='notran safgasdg'><div class='notran mCont'><div class='notran two'>" + rTimer + "</div><a class='notran zr run' href='javascript:void(0)'>" + rConfigure + "</a><a class='notran zr act' href='javascript:void(0)' style='display: none'>" + rReady + "</a><a class='notran zr dis' href='javascript:void(0)' style='display: none'>" + rError + "</a><div class='notran border1'/><div class='notran border2'/><div class='notran border3'/><div class='notran border4'/></div></div>", $("#pageredirect").html($pageredirecthtml),
$time = rTimer, $deggrea = 270 / $time, $deggre = 270 / $time, $work = !1, $q = $time / 3, $tt = function() { $work || ($time <= 0 ? (clearInterval(timing), $(".act").attr("href", rUrl), $(".run").hide(), "false" == $(".act").attr("href") || "javascript:void(0)" == $(".act").attr("href") || "undefined" == $(".act").attr("href") ? $(".dis").show() : ($(".act").show(), $(".act").attr("href") === "false" || void 0 === $(".act").attr("href") || window.location.replace($(".act").attr("href")))) : ($time--, $firstBorder++, 2 * $q <= $time && ($firstBorder == Math.floor($q) && ($deggre = 91), $(".border1").animate({ borderSpacing: $deggre }, { step: function(r, t) { $(this).css("transform", "rotate(" + r + "deg)") }, duration: 800 }, "ease-out")), $q <= $time && ($firstBorder == Math.floor(2 * $q) && ($deggre = 180), $(".border2").animate({ borderSpacing: $deggre }, { step: function(r, t) { $(this).css("transform", "rotate(" + r + "deg)") }, duration: 800 }, "ease-in-out")), $q >= $time && ($firstBorder == Math.floor(3 * $q) && ($deggre = 269), $(".border3").animate({ borderSpacing: $deggre }, { step: function(r, t) { $(this).css("transform", "rotate(" + r + "deg)") }, duration: 800 }, "ease-in-out")), $deggre += $deggrea, $(".two").text($time))) }; var timing = window.setInterval($tt, 800);
$(window).mouseenter(function() { $work = !1 }), $(window).mouseleave(function() { $work = !0 }), String.prototype.replaceAll = function(r, t) { return this.split(r).join(t) }, rUrl = rUrl = decodeURIComponent(findGetParameter("url")), $(document).ready(function() { var r = window.location.toString(); if (0 < r.indexOf("?&url=")) { var t = r.substring(0, r.indexOf("?&url="));
window.history.replaceState({}, document.title, t) } })
function findGetParameter(r) {
return location.href.substr(1).split("&url=")[1].replace("&m=1", "").replace("&m=0", "").replace("?m=1", "")
}
//]]>
</script>
<div>
<!-- يمكن إضافة الوصف هنــــــــــــا -->
</div>
إليك بعض التوضيحات المتعلقة بالكود أعلاه :
- 10 والتي أشرت إليها باللون الأسفر وهي الخاصة بالعداد التنازلي.
- وما تبقى (الرابط معطل !، الرابط جاهز، جاري تهيئة الرابط) فهو واضح من إسمها، ويمكنك تغييرها أو تركها فالأمر يعود إليك.
- بمكن إضافة وصف معين (وصف لمدونتك على سبيل المثال، أو طريقة التحميل، بنر إعلاني ...) وذلك بتغيير :<!-- يمكن إضافة الوصف هنــــــــــــا --> بما تريده.
- يمكنك الآن التعديل على روابطك على الشكل التالي :
<a href="http://www.teqniweb.com/p/redirect.html?&url=http://www.wadefati.com">الرابط الجديد</a>
بدل الطريقة الإعتيادية :<a href="http://www.wadefati.com">الرابط الإعتيادي</a>
انتظر قليلا، فالأمر يهمك كثيرا لأنني لم أنتهي بعد، صحيح أن المرحلة الأولى التي تطرقت إليها كافية بالنسبة لك، لكن ماذا لو أردت تعديل جميع الروابط الحالية لمدونتك عند إضافة تدوينة جديدة، أو الروابط الأخرى في تدويناتك السابقة ؟؟ هنا يأتي الكود الأخير والذي سنقوم بوضعه أسفل قالبك الشخصي ولعمل ذلك تابع معي خطوة خطوة المرحلة الثانية :
مراحل تركيب الإضافة
- إضغط على تحرير HTML ( قم بأخد نسخة إحتياطية للقالب ).
- إبحث عن الوسم </body> و أضف الكود التالي فوقه :
- قم بعد ذلك بحفض القالب
<script>
var dontblockurl= "facebook.com|whatsapp:";
$(".post-body a").each(function() {
var rNamePage= "redirect",
e = new RegExp("(" + window.location.hostname + "|blogger.com|bp.blogspot.com|" + dontblockurl + ")");
0 <= this.href.match(e) && 0 <= this.name.match("more") && !$(this).hasClass("zr") && ($(this).attr("href", window.location.origin + "/p/" + rNamePage + ".html?&url=" + $(this).attr("href")), $(this).attr("target", "_blank")) })
</script>
توضيحات أخرى تتلق بالكود الأخير :
- redirect والتي أشرت إليها باللون الأخضر وهي تتعلق باسم الصفحة التي أنشأناها سابقا بإسم redirect.
- المتغير dontblockurl به موقعان facebook.com و whatsapp: يفرقهما الرمز |، هذا المتغيير يضم المواقع التي يمكن استئنائها عندما يقوم السكريبت بعمل تغيير جميع الروابط الخارجية وجعلها تنطلق من صفحتك التي أنشأتها ليقوم بتوجيهها، كل ما عليك هو وضع روابط المواقع المستثناة دون وضع علامة البروتوكول http أو https.
أتمنى أن يكون الشرح واضحا، وأي سؤال أو استفسار يمكنكم طرحه في قسم التعليقات أسفل التدوينة.
هنا تنتهي تدوينتنا اليوم، ودمتم في رعاية الله وحفضه.
للمرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا.
المصدر : http://www.teqniweb.com/
ليست هناك تعليقات:
إرسال تعليق