شرح تركيب صفحة تحويل الروابط أحترافية

• معلومات شرح تركيب صفحة تحويل الروابط صفحة إعادة توجيه او صفحة Safelink 
• ما هي صفحة اعادة التوجية
• ما هي الاستفاده من عمل صفحة أعاده توجية في مدونتي
• خطوات أنشاء صفحة أعادة التوجية في المدونة
• الكود الخاص الصفحة
• شرح التركيب بالفيديو
• التعديلات
• تغير مدة العداد الثواني بداخل الصفحة
• ملاحظة مهمة

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

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

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

ما هي صفحة اعادة التوجية

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

ما هي الاستفاده من عمل صفحة أعاده توجية في مدونتي

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

خطوات أنشاء صفحة أعادة التوجية في المدونة

1. قم بالذهاب الي لوحة تحكم مدونتك.
2. قم بالذهاب الي الصفحات وأنشاء صفحة جديده.
3. قم بتسمية الصفحة بأسم  conversion-page
4. أحفظ الصفحة بعد أيقاف التعليقات
5. أفتح الصفحة و انتقل الى عرض HTML
6. الصق الكود المخصص للأضافة و أعد تسمية الصفحة بما تريد مثلا صفحة تحويل الروابط

الكود الخاص الصفحة

<!--أضف هنا أكواد الإعلانات إذا كنت ترغب-->

<div style="text-align: center;">

ضع كود الاعلانات

</div>

    <title>صفحة الانتقال</title>

  <style>

.countdown-container{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:20px 0;}

.progress-circle{width:180px;height:180px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:83px;font-weight:bold;color:#ab52ca;margin-bottom:40px;transition:background 1s linear;border:solid 4px #AB52CA;}

#skip-button{display:none;padding:16px 40px;background:linear-gradient(79deg,#aa50c8,#4f20b9);color:#fff;border:none;cursor:pointer;margin-top:15px;border-radius:6px;}

</style>

    <div class="countdown-container">

        <div class="progress-circle">10</div>

        <div class="progress-bar">

            <div class="progress-fill"></div>

        </div>

        <button id="skip-button"> ✔ الأنتقال إلى الرابط</button>

    </div>

    <script>

        const skipButton = document.getElementById('skip-button');

        const progressBar = document.querySelector('.progress-fill');

        const progressCircle = document.querySelector('.progress-circle');

        let count = 10; // عدد الثواني

        // الحصول على الرابط المستهدف من URL

        const urlParams = new URLSearchParams(window.location.search);

        const targetUrl = urlParams.get('url');

        // تحديث العدّاد والتأثير الدائري

        const countdown = setInterval(() => {

            count--;

            if (count >= 0) {

                const percentage = (10 - count) * 20;

                progressCircle.style.background = `none`;

                progressCircle.innerText = count;

                progressBar.style.width = `${percentage}%`;

            }

            if (count === 0) {

                clearInterval(countdown);

                skipButton.style.display = 'block';

            }

        }, 1000);

        // عند الضغط على زر الانتقال

        skipButton.addEventListener('click', function () {

            window.location.href = targetUrl;

        });

    </script>

<!--أضف هنا أكواد الإعلانات إذا كنت ترغب-->

<div style="text-align: center;">

ضع كود الاعلانات

</div>

قم بالانتقال الى اكواد القالب و ابحث عن </body> و الصق الكود التالي اعلاه

      <script type='text/javascript'>

//<![CDATA[

  document.addEventListener("DOMContentLoaded", function () {

    const allLinks = document.querySelectorAll(".post-body a"); 

    // قائمة الدومينات أو الكلمات المستثناة

    const excludedDomains = [

        "facebook.com",

        "twitter.com",

        "instagram.com",

        "linkedin.com"

    ];

    allLinks.forEach(link => {

        const originalURL = link.href;

        const isExcluded = excludedDomains.some(domain => originalURL.includes(domain));

        if (!isExcluded && originalURL !== "#") { // استثناء الروابط الفارغة

            link.href = `الصق رابط الصفحة هنا?url=${encodeURIComponent(originalURL)}`;

        }

    });

});

  //]]>

</script>

شرح التركيب بالفيديو

التعديلات

ضع رابط الصفحة التي قمت يصنعها مكان كلمة الصق رابط الصفحة هنا
تجد في الكود الثاني     // قائمة الدومينات أو الكلمات المستثناة  اسقلهم يمكنك اضافة اي دومين ترد عدم تحويل الرابط الى صفحة تحويل الروابط يجب كتابة الدومين بهذا الشكل  , "twitter.com",  لا تنسى الفاصلة فقط غير الى الدومين المطلوب

تغير مدة العداد الثواني بداخل الصفحة

اذهب الى الاكواد الخاصة بصفحة العداد ستجد الرقم 10 موجود 3 مرات قم بتغير الرقم الةى الرقم اللذي ترده

ملاحظة مهمة

أذا لم يعمل عداد الثواني بعد التركيب يجب عليك أضافة مكتبة JQuery
قم بوضع هذا الكود اسفل <head> مباشرة و سيعمل معك العداد بشكل صحيح

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

و شكرا