اكواد جميلة لوضع اقتباس في مواضيع بلوجر

ثلاثة اكواد جميلة لوضع اقتباس جذاب ومتناسق مع المقالة وبهذه الثلاثة الاكواد المختلفة تستطيع اضافة الكود الذي يعجبك في مدونتك على بلوجر واظهار الموضوع او المقالات في المدونة بشكل جميل. code quotes

صور الكود الاول

طريقة اضافة الكود، اذهب الى تحرير HTML وابحث عن </head> والصق الكود الاسفل أعلاه

<style>
.post blockquote {
    padding: 10px 15px;
    margin: 5px 25px;
    border: 1px solid #E1E1E1;
    /* background-color: #F6F6F6; */
    border-left: 4px solid #18B888;
    font-size: 17px;
    font-family: Times;
}
.post blockquote:before {
content: "\201C";
color: #353535;
font-family: Times;
font-size:50px;
font-weight: bold;
line-height:0px;
vertical-align:middle;
}
.post blockquote:after {
content: "\201D";
color: #353535;
font-family: Times;
font-size:50px;
font-weight: bold;
line-height:0px;
vertical-align:middle;
padding:15px 0px 0px 5px;
}</style>

صور الكود الثاني

طريقة اضافة الكود بنفس الطريقة الاولى

<style>
.post blockquote {
background:#f9f9f9;
border-left:6px solid #ccc;
font-family: Georgia, serif;
margin:1.5em 10px;
padding:.5em 10px;
quotes:"\201C""\201D""\2018""\2019";
}
.post blockquote:before {
color:#ccc;
content:open-quote;
font-family: cambria, Georgia;
font-size:4em;
line-height:.1em;
margin-right:.25em;
vertical-align:-.4em;
}
.post blockquote p {
display:inline;
}
.post blockquote cite {
color: #999999;
font-size: 14px;
display: block;
margin-top: 10px;
}
</style>

الكود الثالث

طريقة اضافة الكود الثالث ستكون مختلفة قليلاً ادخل تحرير HTML ابحث عن ]]></b:skin> والصق الكود الاسفل اعلاه

.post blockquote {
background: #F3F3F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6EnT-bNgvvVA1j-Y9GVOpOKmi9soWoHAJ-dgiWvO7aPqTcjnAmTmEWANp0wCuj3BgGZIhmmqk9EGI2VUO3IEB1WSlYnjU1PgcuH_UrghMooLiC7-PMlDpermUVpBfkoozPVkklHUL8mg/s1600/comma-side-orange1.gif) ;
background-position:;
background-repeat:repeat-y;
margin: 0 20px;
padding: 20px 20px 10px 45px;
font-size: 0.9em;
font: italic 1.2em Georgia, "Times New Roman", Times, serif;
}
.post blockquote p {
margin: 0;
padding-top: 10px;
}

بالتوفيق.