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


اليوم نقدم لكم اضافة رائعة جدا تستخدم لتمييز موضوع أو تدوينة معينة

بشكل جميل في واجهة المدونة في السايدبار



  • لتركيب اضافة الموضوع المميز

  1. من لوحة التحكم اذهب التخطيط ثم إصافة اداة HTML/JavaScript
  2. ألصق هذا الكود :

<div class="team_arab">
<img alt="عرب تيم" src="رابط صورة التدوينة" /><a href="رابط التدوينة"><i class="fa  fa-arrows-alt"></i></a><p>اسم التدوينة</p></div><style>.team_arab{position:relative;padding-top:5px}.team_arab img{width:100%;height:200px}.team_arab a{display:block;width:48px;height:48px;background:rgba(255,255,255,0.8);color:#e23a3e;font-size:20px;text-align:center;line-height:2.6;opacity:0;-webkit-transition:all .3s ease 0;-moz-transition:all .3s ease 0;-ms-transition:all .3s ease 0;-o-transition:all .3s ease 0;transition:all .3s ease 0;-webkit-transform:scale(0.2);-moz-transform:scale(0.2);-ms-transform:scale(0.2);-o-transform:scale(0.2);transform:scale(0.2);position:absolute;top:76px;left:126px;z-index:1001;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}.team_arab p{position:absolute;bottom:0;left:0;background: rgba(77, 135, 209, 0.6);text-align: center;padding:12px 29px;margin:0;font-size:15.1px;color:#FFF;}.team_arab:hover a{opacity:1;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.team_arab:hover a:hover{color:#333}.team_arab_posts{float:right;width:730px;background:#FFF;margin:24px 0;-webkit-box-shadow:0 0 5px #DDD;-moz-box-shadow:0 0 5px #DDD;box-shadow:0 0 5px #DDD}.team_arab_post{position:relative;padding:24px;border-bottom:1px solid #EEE}.team_arab_post_title h1{padding:0;margin:0;font-size:24px;font-weight:400}</style>




  • ونقوم بتغير كل ما بالوان الاحمر بما يلزم

مبروك عليك الاضافة المميزه و الرائعه وكده نكون خلصنا شرح النهارده

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




سوف نتعرف اليوم علي طريقة جميلة جدا لوضع تأتيرات متحركه فى التعليقات ،هذه الخاصية تعطي لتعليقات مدونتك جمالية وتنسيق رائع .

اولآ لتركيب الاضافة 

  1. ندخل الى لوحة التحكم فى بلوجر
  2. نقوم باختيار القالب
  3. نقوم بالضغط على تحرير Html
  4. نقوم بالبحث عن الوسام </body>  (نقوم بالبحث بالضغط على Ctrl+F)
  5. نضع الكود التالى فوق الوسام </body>
<b:if cond='data:blog.pageType == &quot;item&quot;'><script type='text/javascript'>//<![CDATA[jQuery(document).ready(function () {emoticonx({emoRange:"#comments p, div.emoWrap",putEmoAbove:"iframe#comment-editor",topText:"إضغط على الابتسامة لظهور الكود الخاص بها",emoMessage:"لإدراج تعبيرات الوجه يجب إضافة ما لا يقل عن مسافة واحدة قبل الرمز."})});//]]></script><script src='https://arblab.googlecode.com/svn/JS/emoticonnya.js' type='text/javascript'/></b:if>
الان نقوم بالبحث عن الوسام ]]></b:skin>
ونضع فوقها الكود التالى

.emoWrap {
position:relative;
padding:10px;
margin-bottom:7px;
background:#fff;
background-image: -ms-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
background-image: -moz-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
background-image: -o-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
background-image: -webkit-gradient(linear, right top, left top, color-stop(0, #FFFFFF), color-stop(1, #FFF9F2));
background-image: -webkit-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
background-image: linear-gradient(to left, #FFFFFF 0%, #FFF9F2 100%);
border:3px solid #860000;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
-moz-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
-webkit-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
box-shadow:0 2px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
font-weight:normal;
color:#333;
}
.emoWrap:after {
content:"";
position:absolute;
bottom:-10px;
right:10px;
border-top:10px solid #860000;
border-left:20px solid transparent;
width:0;
height:0;
line-height:0;
}
و أخيرا نضيف هدا الكود قبل الوسم </head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>

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



حذف ايقونة التحرير السريع من مدونة بلوجر

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



ايقونة التحرير السريع فائدتها انه اذا كنت داخل الصفحة الرئيسيه لمدونتك فأنك تستطيع تحرير الادوات والتحكم فيها .


طريقة حذف ايقونة التحرير السريع :

  1. ادخل مدونتك .
  2. القالب .
  3. حرر القالب وابحث عن ]]></b:skin>
  4. ضع هذا الكود فوقه : 
.item-control.blog-admin {display: none !important;}


 ثم قم بحفظ القالب ومبروك عليك حذف ايقونة التحرير السريع الدرس بسيط و سهل جدآ و لائ استفسار يرجاء وضعه فى تعليق
كان معكم فريق عرب تيم
الاشتراك في: الرسائل (Atom)

جميع الحقوق محفوظه لمدونةعرب تيم قالب للتعديل من تصميمي 2014

من تصميم : عرب تيم