السلام عليكم ورحمه الله وبركاته اللهم صلى على سيدنا محمد و على ال سيدنا محمد
اهلا بكم احبائي متابعي مدونة نقطة إبداع وزواره الكرام في هذه التدوينة الجديدة والحصرية علي مدونة نقطة إبداع
سوف نقدم لكم في هذه التدوينة طريقة تغير شكل التسميات الى شكلين احترافيين فقط على مدونة نقطة إبداع
صور للإضافة
طريقة التركيب
ادخل على التخطيط القالب تحرير html ابحث عن <head> وضع الكود التالي تحته
<link href="http://fonts.hosni.netdna-cdn.com/fonts/cdn/file_font/?font=JF_Flat_Regular" rel="stylesheet"/>
للتركيب الشكل الأل ابحث عن </head> وضع الكود التالي فوقه
للتركيب الشكل الثاني ابحث عن </head> وضع الكود التالي فوقه
<style>
.list-label-widget-content ul li {
list-style:none;
padding:0;
overflow: hidden;
position: relative;
}
.list-label-widget-content ul {
padding:0
}
.list-label-widget-content ul li a {
display: block;
padding: 7px 5px;
color: #777;
border-bottom: 1px solid #FAFAFA;
font-size: 13px;
font-family: "JF_Flat_Regular";
}
.footer .list-label-widget-content ul li a {
border-bottom:1px solid #312E2E;
background-color:#3D3A3A
}
.list-label-widget-content ul li a:hover {
background-color: #5E9BE7;
color: #FFF!important;
text-decoration: none;
padding-right: 15px;
}
.footer .list-label-widget-content ul li a:hover {
background-color:#FA4710
}
.list-label-widget-content ul li a:before {
content:"\f07c";
display:inline-block;
font-family:FontAwesome;
font-style:normal;
font-weight:400;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale
}
.list-label-widget-content ul li span {
font-weight: 400;
position: absolute;
top: 6px;
left: 6px;
}
.list-label-widget-content ul li:hover span {
color: #FFF;
}
.cloud-label-widget-content {
margin-top:20px
}
.cloud-label-widget-content span {
display:inline-block;
font-size:100%!important;
min-height:30px;
line-height:2em;
margin-bottom:5px
}
.cloud-label-widget-content span a {
background-color:#f0f0f0;
color:#111;
padding:5px 15px
}
.cloud-label-widget-content span a:hover {
background-color:#FA4710;
color:#fff;
text-decoration:none
}
.list-label-widget-content ul li a:before {
margin-left:10px
}
.cloud-label-widget-content span {
float:right;
margin:0 0 8px 3px
}
</style>
}
<style>
/* CSS Popular Posts */
.PopularPosts .widget-content ul{list-style-type:none;overflow:hidden;} #PopularPosts1 ul li .item-thumbnail{overflow:hidden;float :left;margin-right:10px;} #PopularPosts1 img {overflow:hidden;width : 72px;height:72px;-ms-transform: scale(1.0);-webkit-transform: scale(1.0);-moz-transform: scale(1.0);transform: scale(1.0);transition:all .4s linear;-moz-transition:all .4s linear;-webkit-transition:all .4s linear;} #PopularPosts1 img:hover{-ms-transform: scale(1.2);-webkit-transform: scale(1.2);-moz-transform: scale(1.2);transform: scale(1.2);transition:all .4s linear;-moz-transition:all .4s linear;-webkit-transition:all .4s linear;} .PopularPosts .widget-content ul li{position :relative;padding:0;margin:10px auto;} .PopularPosts .widget-content ul li:first-child {margin-top:0;} .PopularPosts .widget-content ul li:last-child {margin-bottom:0;} .PopularPosts .widget-content ul li:nth-child(1){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(202,220,85,0.8);width : 100%;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li:nth-child(2){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(243,93,92,0.8);width : 100%;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li:nth-child(3){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(10,151,181,0.8);width : 100%;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li:nth-child(4){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(15,203,205,0.8);width : 100%;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li:nth-child(5){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(16,170,206,0.8);width : 100%;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li:nth-child(6){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(202,220,85,0.8);width : 100%;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li:nth-child(7){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(243,93,92,0.8);width : 100%;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li:nth-child(8){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(10,151,181,0.8);width : 100%;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li:nth-child(9){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(15,203,205,0.8);width : 100%;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li:nth-child(10){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(16,170,206,0.8);width : 100%;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li a{color:#525f6a;transition:all 0.3s ease-out;} .PopularPosts .widget-content ul li a:hover{color:#e1b364;} .PopularPosts .widget-content ul li:hover:nth-child(1),.PopularPosts .widget-content ul li:hover:nth-child(2),.PopularPosts .widget-content ul li:hover:nth-child(3),.PopularPosts .widget-content ul li:hover:nth-child(4),.PopularPosts .widget-content ul li:hover:nth-child(5),.PopularPosts .widget-content ul li:hover:nth-child(6),.PopularPosts .widget-content ul li:hover:nth-child(7),.PopularPosts .widget-content ul li:hover:nth-child(8),.PopularPosts .widget-content ul li:hover:nth-child(9),.PopularPosts .widget-content ul li:hover:nth-child(10){background:#fff;} .PopularPosts .widget-content{background:#fff;} .PopularPosts .item-thumbnail{float :right;padding:0;margin:0;} .PopularPosts .item-title {color:#b2b5be;font-weight:400;font-size:12px;padding:5px;} .PopularPosts .item-snippet {display :none;font-size:12px;color:#b2b5be;overflow:hidden;text-align:justify;} .sidebar .label-size {position :relative;text-transform:none;text-decoration:none;font-size:12px;font-family:'ge_ss_threeregular';} .sidebar .label-size a {color:#525f6a;font-weight:400;padding:10px 12px; margin:0 0 2px 2px;float :right;display :block;border:4px solid #eceef0;transition: all 0.4s ease-in-out;} .sidebar .label-size-1 a {box-shadow:inset 2px 0 0 0 #1abc9c;opacity:0.8;} .sidebar .label-size-1 a:hover {box-shadow:inset 100px 0 0 0 #1abc9c;color:#fff!important;opacity:1;} .sidebar .label-size-2 a {box-shadow:inset 2px 0 0 0 #3498db;opacity:0.8;} .sidebar .label-size-2 a:hover {box-shadow:inset 100px 0 0 0 #2980b9;color:#fff!important;opacity:1;} .sidebar .label-size-3 a {box-shadow:inset 2px 0 0 0 #2ecc71;opacity:0.8;} .sidebar .label-size-3 a:hover {box-shadow:inset 100px 0 0 0 #27ae60;color:#fff!important;opacity:1;} .sidebar .label-size-4 a {box-shadow:inset 2px 0 0 0 #9b59b6;opacity:0.8;} .sidebar .label-size-4 a:hover {box-shadow:inset 100px 0 0 0 #8e44ad;color:#fff!important;opacity:1;} .sidebar .label-size-5 a {box-shadow:inset 2px 0 0 0 #e74c3c;opacity:0.8;} .sidebar .label-size-5 a:hover {box-shadow:inset 100px 0 0 0 #c0392b;color:#fff!important;opacity:1;} .sidebar .label-size:hover{background:none;} .label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5 { font-size:100%;} .cloud-label-widget-content{text-align:right} .label-size{display :block;float :right;margin:0 0 2px 2px;color:#fff;transition:all 0.4s ease-in-out;}
</style>