غير شكل إشعار ملفات تعريف الإرتباط في مدونتك



السلام عليكم ورحمة الله وبركاته
نشارك اليوم معكم درس جديد من دروس بلوجر والذي سيمكنك من التحكم بشكل إشعار ملفات تعريف الإرتباط أو بما يعرف بـ RGPD
تعرف ما هو قانون حماية البيانات العامة (GDPR)

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


للتحكم بشكل الإشعار قم بإضافة CSS إلى مدونتك من خلال نسخ الكود أدناه ثم التوجه إلى المدونة الخاصة بك أنقر على "المظهر => تحرير html => ثم أبحث عن الرمز ]]></b:skin> وأضفه فوقه مباشرةً"
/*!
* شكل مخصص: Cookie-Choices v1.0.1
* by www.madad2.com
*/
/*إعادة تعيين ملف cookie-choices.css*/
body .cookie-choices-info,
body .cookie-choices-info .cookie-choices-button,
body .cookie-choices-info .cookie-choices-buttons,
body .cookie-choices-info .cookie-choices-inner,
body .cookie-choices-info .cookie-choices-text{
    position:initial;margin:initial;
    left:initial;right:initial;bottom:initial;width:initial;
    top:initial;color:initial;padding:initial;background:initial;
    text-transform: initial;font-size: initial;max-width: initial;text-align: center;
}
/*التأثيرات*/
@-webkit-keyframes cookies {
    from {-webkit-transform:translateY(10em);transform:translateY(10em);}
    to {-webkit-transform:translateY(0em);transform:translateY(0em);}
}
@keyframes cookies {
    from {-webkit-transform:translateY(10em);transform:translateY(10em);}
    to {-webkit-transform:translateY(0em);transform:translateY(0em);}
}
/*الحاوية الرئيسية*/
body .cookie-choices-info {
    position: fixed;
    bottom: 0;left: 0;right: 0;
    font-size: 14px; /*حجم الإشعار*/
    -webkit-animation: cookies 1s backwards;
            animation: cookies 1s backwards;
}
body .cookie-choices-info .cookie-choices-inner {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
body .cookie-choices-info .cookie-choices-buttons {
    padding-top: 1em;
}
/*إيطار النص والأزرار*/
body .cookie-choices-info .cookie-choices-inner {
    padding: 1.5em; /*الحشو*/
    background: #6dafd5; /*لون الخلفية*/
}
/*نص*/
body .cookie-choices-info .cookie-choices-text {
    color: #fff; /*لون النص*/
    padding: 0 1em;
}
/*أزرار*/
body .cookie-choices-info .cookie-choices-button {
    color: #fff; /*لون نص الأزرار*/
    margin-left: .5em;
    padding: .8em 1em; /*ملء الأزرار*/
    display: inline-block;
    background: rgba(115, 182, 219); /*لون الخلفية من الأزرار*/
    border-radius: 3px;
    font-size: .9em;
    -webkit-transition:background .3s;
    transition: background .3s;
}
/*تحوم => الأزرار*/
body .cookie-choices-info .cookie-choices-button:hover {
    background: rgba(0, 0, 0, 0.75); /*لون زر عند التأشير عليه*/
} 

يمكنك تخصيص الرمز بحسب مظهر مدونتك بتغيير الألوان والأحجام بما يناسبك وبعد أن تنتهي يمكنك النقر على حفظ المظهر
بأمان الله ...


مشاركات أقدم المقال التالي
لا يوجد تعليقات
أضف تعليق
عنوان التعليق