صندوق اقتباس لمدونات بلوجر |
السلام عليكم ورحمة الله تعالى وبركاته ، مرحبا بكم في هذا الموضوع الجديد سنحاول التطرق الى اضافة مهمة في مدونات بلوجر، فبعد ان طلب مني احد متابعي مدونة تدوين باحتراف طريقة اضافة الأكواد والنصوص في صناديق أنيقة في مشاركات مدونات بلوجر، قمت بوضع هذا الموضوع من اجل التطرق لهذه الاضافة والكود المسؤول عنها ومناقشة الكود لفهمه وفهم طريقة التعديل عليه. الكود الذي سنتطرق اليه في هذا الموضوع هو عبارة عن تنسيق Style css. تابعو معنا الشرح.
كود صندوق اقتباس لمدونات بلوجر
/** Style Css blockquote By:Tadwinpro.blogspot.com **/
.post blockquote {
position: relative;
z-index: 50;
background: #f9f9f9 url(http://3.bp.blogspot.com/-tabzcxz1DTU/VNaDBpOCgcI/AAAAAAAAA90/AngvGg9lyPQ/s1600/blockquote.png) no-repeat top left;
border: 1px solid #999;
color: #222;
display: block;
margin: 10px 0 10px;
padding: 20px 15px 17px;
overflow: auto;
max-height: 250px;
font: normal 14px tahoma;
line-height: 27px;
background-size: 20%;
}
بعض التعديلات على الكود لتفهمه وتعدل عليه كما تريد
الرابط الملون لاللون الأحمر هو رابط الصورة الموجودة في أقصى اليسار (ان كنت تود تغييرها فقط استبدله برابط صورة اخرى، او ان كنت لا تريد ان تكون اي صورة فاحذفه)
الكلمة top هي المسؤولة عن تموضوع الصورة في الأعلى (إن كنت تود ان تضهر في الأسفل استبدلها بـ: Bottom)
الكلمة left مسؤولة عن ظهور الصورة في اليسار (استبدلها بـ: right ان كنت تودها ان تضهر في اليمين)
القيمة 14px هي حجم الخط
القيمة 20% هي حجم الصورة في حالة اردت تصغير الصورة او تكبيرها فغير الفيمة الى ما يناسبك.
أين سأضع الكود؟
طبعا الكود عبارة عن تنسيق css يتم وضعه ضمن أكواد css في القالب.
اولا اتجه الى لوحة تحكم مدونتك ثم القالب ثم تعديل HTML، الآن ابحث عن الكود التالي ]]> عن طرق الضغط على زر ctr+F ثم ضع الكود السابق فوقه اي قبله، ثم اضغط على حفظ .
الآن بعدما أضفنا الكود، كلما يجب عليك فعله الآن هو عندما تريد اضافة كود في صندوق او اي اقتباس داخل اي موضوع ما عليك الا تحديد النص بالماوس والضغط على زر الاقتباس ثم الضغط على "إنشر" وعند الدخول الى التدوينة في مدونتك ستلاحظ ان النص الذي قمت بتحديده قد اضيف في الصندوق.
الى هنا يكون الموضوع قد انتها، ونكون قد تطرقنا الى موضوع واضافة صندوق اقتباس لمدونات بلوجر .
اذا اعجبتك الاضافة لا تنسى دعمنا عن طريق عمل الآتي وشكرا:
إرسال تعليق