بشكل مختلف غير التسميات لقوالب بلوجر

بواسطة: Unknown - فى: - 2 التعليقات
السلام عليكم ... سوف اقدم لكم اليوم موضوع عن طريقة تغيير الشكل العام للتسميات فى قالبك بشكل مميز وبتأثيرات رائعة ...
معظم القوالب تكون التسميات تظهر اسماء الأقسام والفروع منها متجاورة وبشكل غير مستحب ؛ وتريد ان تغير هذا الشكل بشكل جميل سوف اساعدك بهذا بطريقة سهلة وجميلة تابع معى ...

 تركيب الاضافة :


1- من لوحة التسجيل -->   قالب   -->  تحرير HTML (احفظ نسخة من القالب)
2- ابحث بواسطة   CTRL+F  على الوسم :
 ]]></b:skin>
3- انسخ كود الشكل الذي تريده وضعه قبل الوسم مباشرة ..
4- احفظ القالب .
تنبيه : لا تنس اضافة أداة التسميات من خلال  تخطيط   --> اضافة أداة  -->  التسميات { ان لم تكن أضفتها من قبل أما ان كانت لديك فلا داعى لأضافتها من جديد}
ننتقل الى الأشكل ...

الشكل الأول


بشكل مختلف غير التسميات لقوالب بلوجر

.label-size{
background: #DAD8D9;
background: -moz-linear-gradient(top,  #F0F0F0 , #DAD8D9 );
background: -webkit-linear-gradient(top,  #F0F0F0 ,#DAD8D9 );
margin:0 4px 7px 0;
padding: 2px 7px 2px 7px;
text-transform: uppercase;
border: solid 1px #777;
float:right;
text-decoration:none;
font-size:14px;
font-weight:bold;
box-shadow: 0 1px 2px #999;
border-radius:20px;-webkit-border-radius:20px;-moz-border-radius:20px;
text-align:center;
}
.label-size:hover {
background: #D1E0E5;
background: -moz-linear-gradient(top,#EEF3F6,#D1E0E5);
background: -webkit-linear-gradient(top,#EEF3F6,#D1E0E5);
}

الشكل الثانى


بشكل مختلف غير التسميات لقوالب بلوجر

.Label a {
     -moz-border-bottom-colors: none;
     -moz-border-left-colors: none;
     -moz-border-right-colors: none;
     -moz-border-top-colors: none;
     background-color: #7FBF4D;
     background-image: -moz-linear-gradient(center top , #7FBF4D, #63A62F);
     border-bottom-right-radius: 30px;
     border-color: #63A62F #63A62F #5B992B;
     border-image: none;
     border-style: solid;
     border-top-left-radius: 30px;
     border-width: 1px;
     box-shadow: 0px 1px 0px 0px #96CA6D inset;
     color: #FFFFFF;
     float: left;
     font: 14px verdana;
     height: 18px;
     margin-bottom: 9px;
     margin-left: 10px;
     padding: 10px;
     position: relative;
     text-decoration: none;
     transition: all 0.5s ease-in-out 0s;
}
.Label a:hover {
     background: none repeat scroll 0% 0% orange;
     border-radius: 0px 30px 0px 30px;
     border: 1px solid orange;
     text-shadow: 5px 5px 5px #DCDCDC;
}
.Label {
     margin: 0px;
     padding: 0px;
     position: relative;
}
.Label li:hover {
    transform: rotate(5deg);
}
.Label li {
    float: left;
    font-size: 116%;
    list-style: none outside none;
    transition: all 0.3s ease 0s;
}

الشكل الثالث


بشكل مختلف غير التسميات لقوالب بلوجر


#Label1 a{outline: 1px rgba(255,255,255,0.4) dashed;
    border: 1px rgba(0,0,0,0.3) dashed;
    padding: 4px 10px 4px 20px;
    text-decoration: none;
    color:#000000;
    white-space: nowrap;
font-family: Arial;
    font-size: 12px;
    font-weight: bold;
    position: relative !important;
    background: #8dc63f;
    float: left;
    padding: 5px 3px;
    margin: 0 5px 5px 0;
   border-radius:4px 4px; -moz-border-radius:4px 4px 4px 4px; -khtml-border-radius:4px 4px 4px 4px; -webkit-border-radius:4px 4px 4px 4px; border-radius:4px 4px 4px 4px;
}
#Label1 a:hover{color: rgba(0,0,0,0.5);}
.label-size{line-height:1.5;align:left;}

الشكل الرابع


بشكل مختلف غير التسميات لقوالب بلوجر


#Label1 a{
outline:1px dotted #FEB380;border: 1px rgba(0,0,0,0.2) solid;padding: 6px 8px 6px 14px;text-decoration:none;
color:black;white-space: nowrap;
font-family: arial,serif;text-transform:capitalize;
font-size: 12px;font-weight: bold;
position: relative !important;background: #aa00ff;
-moz-opacity:0.75;
-khtml-opacity:0.75;opacity:0.75;
filter:alpha(opacity:75%);
float:left;padding: 4px 3px;
margin: 0 5px 5px 0;
border-radius:4px 4px; -moz-border-radius:8px 4px 4px 4px; -khtml-border-radius:4px 4px 4px 4px; -webkit-border-radius:4px 4px 4px 4px; border-radius:4px 4px 4px 4px;
}
#Label1 a:hover {
-moz-opacity:1;
-khtml-opacity:1;
opacity:1;
background:#A55A27;color:white;
-webkit-transition:all ease-in-out .5s;
-moz-transition:all ease-in-out .5s;
-o-transition:all ease-in-out .5s;
transition:all ease-in-out .5s;
}
#Label1 a:active {
background:#B24700;color:#80FFFE;
-webkit-transition:all linear .5s;
-moz-transition:all linear .5s;
-o-transition:all linear .5s;transition:all linear .5s;
}


الشكل الخامس


بشكل مختلف غير التسميات لقوالب بلوجر


#Label1 a{float: left;
    font-size: 11px!important;
    line-height: 1em!important;
    display: block;
    margin-right: 7px;
    margin-bottom: 7px;
    padding: 7px;
    background: #ffd964 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzEnSlLlRz6w4U68JpdtgUAft5xs8prDDj-1WfDNy0kNETEcqzJJvHm179Oh1coXV40ydwJQCYq0m6rEVDOKu27qYwOmaHiWdblssuUD5jSZa2cdkmaCDKRo3GZkeHfmVpCwD6_SaQuL0/s1600/yellow-btrix.png);
    border: 1px solid #F9B653;
    color: #9C6533!important;
    text-shadow: 1px 1px 0px rgba(255,255,255,0.4);
    box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.1);
    webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
#Label1 a:hover{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhSVukqezaUEBql0cy7INhxFCIcRHx_xpp8BMMCHrwG98ljY2vHvAEpwSuEw4YfgSkNkYfhYrXFWRdzoalzeRGOr8DzX5XQoKhtFoZt300Fw8-omqyqY6A4h-ll3ek03uNEaLU12MTkZk/s1600/yellow-btrix-hover.png);}
#Label1 a:active { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTLj2yn6NxMrluAum60L5E7JnR5LMuxiImUjsts7NpZtY447qqy_HqAPSnTsgJByRVoUNftJoPxwuENKT4rjyH0yia-r1V7I74yJov2vGPXP7LeHwWLO6bP8WVE6yLazNzZF95fnVbgOI/s1600/yellow-btrix-active.png); }


الشكل السادس


بشكل مختلف غير التسميات لقوالب بلوجر
#Label1 a{float:left;height:18px;line-height:18px;position:relative;font-size:12px;margin-bottom: 9px;margin-left:10px;padding:5px;background: rgb(69,72,77); /* Old browsers */background: -moz-linear-gradient(top,  rgba(69,72,77,1) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(69,72,77,1)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */background: -webkit-linear-gradient(top,  rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */background: -o-linear-gradient(top,  rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */background: -ms-linear-gradient(top,  rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* IE10+ */background: linear-gradient(to bottom,  rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* W3C */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ); /* IE6-9 */color:#fff;text-decoration:none;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;}#Label1 a:hover{fbackground: rgb(73,192,240); /* Old browsers */background: -moz-linear-gradient(top,  rgba(73,192,240,1) 0%, rgba(44,175,227,1) 100%); /* FF3.6+ */background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(73,192,240,1)), color-stop(100%,rgba(44,175,227,1))); /* Chrome,Safari4+ */background: -webkit-linear-gradient(top,  rgba(73,192,240,1) 0%,rgba(44,175,227,1) 100%); /* Chrome10+,Safari5.1+ */background: -o-linear-gradient(top,  rgba(73,192,240,1) 0%,rgba(44,175,227,1) 100%); /* Opera 11.10+ */background: -ms-linear-gradient(top,  rgba(73,192,240,1) 0%,rgba(44,175,227,1) 100%); /* IE10+ */background: linear-gradient(to bottom,  rgba(73,192,240,1) 0%,rgba(44,175,227,1) 100%); /* W3C */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#49c0f0', endColorstr='#2cafe3',GradientType=0 ); /* IE6-9 */}.label-size{line-height:1.5;align:left;}.h2head-text {margin:-40px 10px 8px 55px;color:#666666;font-family:arial;font-size:13px;}#Label1{width:320px;;border-bottom-width: 1px;border-bottom-style: solid; border-bottom-color: #D8D8D8;}

الشكل السابع
بشكل مختلف غير التسميات لقوالب بلوجر
.Label a{ padding-left:20px; background:#000; padding:0 20px; color:#fff!important; border-radius:100px; -moz-border-radius:100px; height:32px; line-height:32px; text-transform:uppercase; text-decoration:none; border:none !important; -webkit-transition:all .3s ease-in-out !important; 30pxt: 30px; float:left; margin-left:5px; margin-top:5px; font-size:10px; margin-bottom:5px;} .Label a:hover{ color:#fff !important; background:#e25f07 }

الشكل الثامن
بشكل مختلف غير التسميات لقوالب بلوجر
 .label-size a {    display: inline-block;    text-decoration: none;    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);    padding: 4px 7px;    font-family: 'Helvetica Neue', helvetica, sans-serif;    font-size: 15px;    line-height: 14px;    height: 14px;    vertical-align: middle;    margin-bottom: 6px;    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px;    -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), inset 0 1px 0 0 rgba(255, 255, 255, 0.4);    -moz-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), inset 0 1px 0 0 rgba(255, 255, 255, 0.4);    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), inset 0 1px 0 0 rgba(255, 255, 255, 0.4);}.label-size a {    color: #000000;    border: 1px dotted #FFFFFF;    background: rgb(238,177,75);    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VlYjE0YiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjYzkxMmQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);    background: -moz-linear-gradient(top,  rgba(238,177,75,1) 0%, rgba(204,145,45,1) 100%);    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(238,177,75,1)), color-stop(100%,rgba(204,145,45,1)));    background: -webkit-linear-gradient(top,  rgba(238,177,75,1) 0%,rgba(204,145,45,1) 100%);    background: -o-linear-gradient(top,  rgba(238,177,75,1) 0%,rgba(204,145,45,1) 100%);    background: -ms-linear-gradient(top,  rgba(238,177,75,1) 0%,rgba(204,145,45,1) 100%);    background: linear-gradient(top,  rgba(238,177,75,1) 0%,rgba(204,145,45,1) 100%);    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FF3333', endColorstr='#330000',GradientType=0 );}.label-size a:before  {    content: '\2022';    color: #FFFFFF;    margin-right: 4px;    font-size: 15px;    line-height: 13px;    height: 13px;    vertical-align: text-top;    text-shadow: 0 -1px -1px rgba(0, 0, 0, 0.2);}.label-size a:hover {    text-decoration: none;    background: rgb(240,183,86);    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YwYjc1NiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkNmEwNDQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);    background: -moz-linear-gradient(top,  rgba(240,183,86,1) 0%, rgba(214,160,68,1) 100%);    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(240,183,86,1)), color-stop(100%,rgba(214,160,68,1)));    background: -webkit-linear-gradient(top,  rgba(240,183,86,1) 0%,rgba(214,160,68,1) 100%);    background: -o-linear-gradient(top,  rgba(240,183,86,1) 0%,rgba(214,160,68,1) 100%);    background: -ms-linear-gradient(top,  rgba(240,183,86,1) 0%,rgba(214,160,68,1) 100%);    background: linear-gradient(top,  rgba(240,183,86,1) 0%,rgba(214,160,68,1) 100%);    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CCCCCC', endColorstr='#990000',GradientType=0 );}


 انتهينا من الأضافة ...
تحياتى للجميع .. ومن يريد مساعدة اترك تعليق وسوف نقوم بمساعدتك
عنوان التدوينة: بشكل مختلف غير التسميات لقوالب بلوجر
تقييم : 100من 100مرتكز على 53 تقييم.
الكاتب / المدير : Unknown
التسميات :
توقيت النشر : 5:37 م
عدد التعليقات : 2
عدد المشاهدات :
get

نبذة عن الكاتب

Unknown

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

هناك تعليقان (2):

  1. اسماعيل بدوى19 يونيو 2015 في 5:16 م

    السلام عليكم ممكن مساعده فى التطبيق توجد مشكلة عندما اطبقها فى القالب

    ردحذف
    الردود
    1. Unknown20 يونيو 2015 في 6:02 م

      تفضل اخى ما هى مشكلتك .. سوف نساعدك انشاء الله

      حذف

" ما يلفظ من قول إلا لديه رقيب عتيد "

الموضوع السابق الصفحة الرئيسية الموضوع التالي
الاشتراك في: تعليقات الرسالة (Atom)

Copyleft © 2013 نيو ويب بلوجر { NEW WEB }

العودة الى الأعلى