طريقة رائعة لعرض الاكواد في المدونة

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

معاينة

طريقة الاضافة سهلة جدا ماعليك هو عند كتابتك لتدوينة انتقل الى تبويب html والصق هذا الكود هناك 

<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="code1" style="-webkit-transition: all 0.3s ease-in-out; -webkit-user-select: text; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFgeCHqlUyuiqTeLyQb_fTr11suGvR41tS0ASIUtMqsHYOu2xLCtBZUSBtTQ9Dd35kX4VKghxNDjknFVgOrf3QiGaysCAMmqOtc_qVcljkTRDewr2LAB3QP3Kt2xnxb1G9WCVyVbrYyqtx/s1600/hover+html+teacher.png) no-repeat rgb(249, 249, 249); clear: both; font-family: Consolas, 'Courier New', Courier, mono, serif; font-size: 14px; height: 260px; line-height: 22.3999996185303px; list-style-type: none; margin: 15px 35px 15px 15px; overflow: auto; padding: 5px 8px 15px 165px; text-align: start; transition: all 0.3s ease-in-out; width: 250px; word-wrap: break-word;">
<span style="color: #cc0000;">ضع الكود هنا</span></div>
<br /></div>

ثم ضع مكان ضع الكود هنا الكود الخاص بك ونهانينا الاضافة الرائعة, لا تنسو دعم المدونة ادا افدناكم ولو شوء اعمل لايك لي الصفحة الفيسبوك وشكراا