اضافة زر تبليغ عن مشكلة لمدونات بلوجر

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

وحل مشاكل و أخطاء مدونتك من قبل الزائر. 

بحيث تصلحيك وحل مشاكل المدونة تصلح مدونتك وتعطي للزائر أحسن تجربة للمستخدم .

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

معاينة الأداة

معاينة الاضافة

شرح طريقة التركيب :

أولا ستذهب الى بلوجر ثم الى المظهر , ثم تعديل HTML و تضغط على Ctrl و F ثم ابحث عن الكود ]]></b:skin> ألصق الكود التالي فوقه :

.reporet-zn svg { fill: #fff; background: #fe3231; width: 35px; height: 35px; padding: 0px 7px;border-radius: 1000px;}
.znthec-tips, [class*=znthec-tips] { position: relative; display: inline-block; -webkit-font-smoothing: antialiased; height: 100% } .znthec-tips::before, [class*=znthec-tips]::before { content: attr(data-title); white-space: nowrap; top: -10px; color: #fff; font-weight: 400; padding: 4px 7px; background: #fe3231; box-shadow: 0 2px 2px -1px rgb(0 0 0 / 30%), 0 1px 0 0 rgb(0 0 0 / 5%); pointer-events: none; font-size: 14px; text-decoration: none; border-radius: 7px; } .znthec-tips::after, [class*=znthec-tips]::after { content: ""; border-style: solid; border-color: #fe3231 transparent transparent; border-width: 10px; top: 8px; } .znthec-tips::after, .znthec-tips::before, [class*=znthec-tips]::after, [class*=znthec-tips]::before { opacity: 0; position: absolute; left: 50%; z-index: 100; -webkit-transform: translate(-50%, -100%); transform: translate(-50%, -100%); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transform-origin: top; transform-origin: top } .znthec-tips::after, [class*=znthec-tips]::after { content: ""; border-style: solid; border-color: #fe3231 transparent transparent; border-width: 10px; top: 8px } .znthec-tips:hover::after, .znthec-tips:hover::before, [class*=znthec-tips]:hover::after, [class*=znthec-tips]:hover::before { opacity: 1 }

ثم أيضا قم بالخطوة الأخيرة وهي البحث عن الكود <data:post.body/> بعد البحث عليه ستجد منه أثنين أو ثلاث كل قالب يختلف عن الأخر انما يكون الكود الذي سنستعمله الثاني أو هناك طريقة وهي عند البحث الكود نضع فوقه وأسفله حروف أو أرقام ثم نذهب لأي مقال اذا وجدنا الأرقام والحروف الذي وضعناه فوقه وأسفله فهذا هو الكود المطلوب اذا لم تجدها ظهرب فاستمر بتطبيق العملية على الأكواد الباقية .
كما قلنا في السابق بعد ايجاده نضع الكود التالي أسفله :

<b:if cond='data:view.isPost'>
<center>
<div class="reporet-zn">
<a class="znthec-tips" data-title="تبليغ عن مشكلة !" href="https://mail.google.com/mail/?ui=2&amp;view=cm&amp;fs=1&amp;tf=1&amp;to=zinoozizoo12@gmail.com&amp;su=تبليغ عن مشكلة" rel="nofollow" target="_blank">
<svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 5.177l8.631 15.823h-17.262l8.631-15.823zm0-4.177l-12 22h24l-12-22zm-1 9h2v6h-2v-6zm1 9.75c-.689 0-1.25-.56-1.25-1.25s.561-1.25 1.25-1.25 1.25.56 1.25 1.25-.561 1.25-1.25 1.25z"></path></svg></a>
</div>
</center>
</b:if>

بعد لصقه ستقوم بتعديل بسيط وهو تغيير هذا الايميل zinoozizoo12@gmail.com بايميل الخاص بك الذي تريد أن تتوصل 

بالمشاكل المبلغة وثم حفظ .

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