كيفية إضافة لافتة موافقة على ملف تعريف الارتباط على Blogger

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

إذا كنت مدونًا تستخدم Blogger ، فمن الضروري إضافة لافتة موافقة على ملف تعريف الارتباط إلى موقعك لضمان الامتثال للوائح مثل اللائحة العامة لحماية البيانات (GDPR) وقانون خصوصية المستهلك في كاليفورنيا (CCPA).

ما هو شعار الموافقة على ملفات تعريف الارتباط ؟

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

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

تعد إضافة شعار الموافقة على ملف تعريف الارتباط إلى موقع Blogger عملية بسيطة نسبيًا يمكن إكمالها في بضع خطوات. في الأقسام التالية ، سنحدد خطوات إضافة شعار الموافقة على ملف تعريف الارتباط على Blogger

كيفية إضافة لافتة موافقة على ملف تعريف الارتباط على Blogger

لإضافة شعار الموافقة على ملفات تعريف الارتباط أو نافذة منبثقة في Blogger ، اتبع الخطوات أدناه.

1. افتح لوحة تحكم Blogger وانتقل إلى قسم المظهر.
2. انقر الآن على قسم تحرير HTML من القائمة المنسدلة على الجانب الأيمن من زر التخصيص.
3. ابحث الآن عن علامة إغلاق النص (</ body) والتي تعد عمومًا السطر الثاني الأخير من رمز السمة الخاص بك.
4. الآن قم بلصق الرمز المحدد فوقه مباشرةً واحفظ الرمز لإضافة شعار الموافقة على ملف تعريف الارتباط إلى موقع الويب الخاص بك على Blogger.

 <div class='cookie-box'> <div class='cookie-row'> <div class='cookie-img'><svg viewBox='0 0 97.93 97.93' xmlns='http://www.w3.org/2000/svg'><path d='M44,23.76a2.47,2.47,0,1,0,.91,3.37A2.47,2.47,0,0,0,44,23.76Z'></path><path d='M25.9,40.32a2.47,2.47,0,0,0,0,4.93h0a2.47,2.47,0,1,0,0-4.93Z'></path><circle cx='32.08' cy='65.86' r='2.47'></circle><path d='M56.38,69.91a2.47,2.47,0,1,0,1.14,1.49A2.47,2.47,0,0,0,56.38,69.91Z'></path><path d='M72,52.68a2.47,2.47,0,0,0-2.38,1.83,2.44,2.44,0,0,0,.25,1.87,2.47,2.47,0,0,0,4.52-.59,2.44,2.44,0,0,0-.25-1.87A2.47,2.47,0,0,0,72,52.68Z'></path><path d='M89.51,52.86A14,14,0,0,1,81,47.2,14.09,14.09,0,0,1,61,35.68,14.09,14.09,0,0,1,49.49,15.73a14,14,0,0,1-5.66-8.55,44,44,0,0,0-21.09,6.15A44.26,44.26,0,0,0,71.46,87.08,44.24,44.24,0,0,0,89.51,52.86ZM28.28,43.42a2.47,2.47,0,0,1-2.38,1.83h0a2.47,2.47,0,1,1,2.38-1.83Zm3.8,24.9a2.47,2.47,0,1,1,2.47-2.47A2.47,2.47,0,0,1,32.08,68.32ZM44.92,27.13A2.47,2.47,0,1,1,44,23.76,2.47,2.47,0,0,1,44.92,27.13ZM57.28,73.27a2.47,2.47,0,1,1-.9-3.36,2.47,2.47,0,0,1,.9,3.36ZM74.42,55.79a2.47,2.47,0,1,1-.25-1.87A2.45,2.45,0,0,1,74.42,55.79Z' fill='#7577a9'></path><path d='M97.93,48.52v-.2A2.35,2.35,0,0,0,95.7,46a9.37,9.37,0,0,1-8-5.45,2.35,2.35,0,0,0-3.49-.93,9.51,9.51,0,0,1-5.44,1.72A9.4,9.4,0,0,1,69.39,31.1a2.35,2.35,0,0,0-2.55-2.55c-.28,0-.57,0-.85,0a9.39,9.39,0,0,1-7.68-14.81,2.35,2.35,0,0,0-.93-3.49,9.37,9.37,0,0,1-5.45-8A2.35,2.35,0,0,0,49.61,0H49a49,49,0,1,0,49,49C97.93,48.82,97.93,48.67,97.93,48.52ZM71.46,87.08A44.26,44.26,0,0,1,22.74,13.33,44,44,0,0,1,47.53,4.72a14,14,0,0,0,5.66,8.55A14.09,14.09,0,0,0,64.71,33.22,14.09,14.09,0,0,0,84.66,44.75a14,14,0,0,0,8.56,5.66A44.3,44.3,0,0,1,71.46,87.08Z'></path></svg></div> <div class='cookie-content'> <p>Our website uses cookies to improve your experience. <a href='https://policies.google.com/technologies/cookies' target='_blank' title='Learn more'>Learn more</a></p> <button class='cookie-buttons'>Accept!</button> </div> </div> </div> <style> .cookie-box.hide{display:none} .cookie-box { position: fixed; width: 90%; margin: 20px; max-width: 400px; min-height: 100px; background-color: #ffffff; box-shadow: 25px 12px 25px 12px rgb(30 30 30 / 4%); z-index: 990; border: 2px solid lightgrey; border-radius: 6px; bottom: 15px; right: 0px; padding: 15px; } .cookie-row { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; text-align: left; align-content: center; justify-content: center; align-items: center; } .cookie-img{padding-right:20px} .cookie-img svg{fill:#333;width:60px;height: 60px;} .cookie-content p { position: relative; width: 100%; display: inline-block; font-size: 15px; color: #666666; margin-top: 0!important; } .cookie-content pa{text-decoration:underline;} .cookie-buttons { position: relative; width: 100%; margin-top: 10px; float: left; background-color: #7577a9; font-family: inherit; font-size: 14px; color: #ffffff; text-decoration: none; opacity: 1; border: none; cursor: pointer; font-weight: 500; padding: 5px; border-bottom: 2px solid rgba(0,0,0,0.1); border-radius: 6px; } </style> <script>//<![CDATA[ cookieChoices = {}; const cookieBox = document.querySelector(".cookie-box"), acceptBtn = cookieBox.querySelector("button"); acceptBtn.onclick = ()=>{ document.cookie = "CookieByKey2Blogging; max-age="+60*60*24*30; if(document.cookie){ cookieBox.classList.add("hide"); }else{ alert("Cookie can't be set! Please unblock this site from the cookie setting of your browser."); } } let checkCookie = document.cookie.indexOf("CookieByKey2Blogging"); checkCookie != -1 ? cookieBox.classList.add("hide") : cookieBox.classList.remove("hide"); //]]></script>

سيؤدي هذا الرمز إلى إزالة إشعار ملف تعريف الارتباط الافتراضي من Blogger وإضافة لافتة موافقة مخصصة لملف تعريف الارتباط أو يمكنك قول نافذة منبثقة لموقع الويب الخاص بك على blogger.

تم تحسين هذا الرمز بالكامل ويستخدم أكواد SVG ، لذلك لا داعي للقلق بشأن سرعة الموقع على موقع blogger.

في الختام ، تعد إضافة شعار الموافقة على ملف تعريف الارتباط إلى موقع Blogger أمرًا ضروريًا لضمان الامتثال للوائح خصوصية البيانات وتوفير الشفافية للمستخدمين.

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

بالمناسبة ، يمكنك تعييني لتحسين سرعة تحميل Blogger. تحقق من صفحة خدماتنا لمعرفة المزيد.