حصريا 6 اشكال سحابة تسمية ممتازبشكل جديد وتطوير اروع

التسمية (فئات) الكلمات الرئيسية في الغالب على تسميات الكلمات الرئيسية العامة والمحددة من المحتوى الخاص بك. أن تمكن المصممين لتشكيل اسلوبهم الخاص. منذ تم إنشاءاشكل السحب الجديدة ، حصلت على كل اصحاب المدونين واعادة تشكيلها لهم مختلف تماما في الشكل والمظهر. حتى اليوم أنا أحمل إليكم هذا نمط مختلف من ممتاز سحابة تسمية المدونه. لأن بعض من قرائي تسأل عني لجعل الاضافة من تسمية نمط سحابة لمدونه. الآن هنا كيف استخدام الاضافة :). تخصص فى مدونتك هو ستة اشكلك مختلفة هنا والتي يمكنك إنشاء الاضافة الخاص بيك ومثل مباشر عن الاضافة من هنــــــــــــــــــــا

طريقه تركيب الاضافة فى مدونتك




الآن انتقل إلى لوحة التحكم -> قالب -> تحرير ثم اضغط على





وهذا هيا طريقه استخدام المحرر الجديد html من هنــــــــا


ثم ابحث عن الكود التالى
كود HTML:]]>

واضف فوقه الكود الذى يناسب مدونتك


الشكل الاول

كود

HTML:.label-size{ margin:0 2px 6px 0; padding: 3px; text-transform: uppercase; border: solid 1px #C6C6C6; border-radius: 3px; float:left; text-decoration:none; font-size:10px; color:#666; display:inline-block;float:none;font-family:"Trebuchet MS","Arial","Helvetica",sans-serif;font-style:normal;font-weight:bold;text-decoration:none;background-color:#1BA1E2;color:#fff !important;-webkit-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-moz-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-o-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-webkit-box-shadow:0 0 1px #999999;-moz-box-shadow:0 0 1px #999999;-o-box-shadow:0 0 1px #999999;box-shadow:0 0 1px #999999;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:-webkit-transform 0.1s ease-in;-moz-transition:-moz-transform 0.1s ease-in;-o-transition:-o-transform 0.1s ease-in;transition:transform 0.1s ease-in; } .label-size:hover { color:#fff;background-color:#0c92da;-webkit-box-shadow:0 0 20px rgb(0,0,50);-moz-box-shadow:0 0 20px rgb(0,0,50);-o-box-shadow:0 0 20px rgb(0,0,50);box-shadow:0 0 10px rgb(0,0,50);-webkit-transform:rotate(3deg) scale(1.2);-moz-transform:rotate(3deg) scale(1.2);-o-transform:rotate(3deg) scale(1.2);transform:rotate(3deg) scale(1.2); filter: progid:DXImageTransform.Microsoft.Matrix( M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand'); zoom: 1; } .label-size a { display:inline-block;float:none;margin:2px 1px;padding:6px 3px;font-family:"Trebuchet MS","Arial","Helvetica",sans-serif;font-style:normal;font-weight:bold;text-decoration:none;background-color:#252c44;color:#fff !important;-webkit-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-moz-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-o-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-webkit-box-shadow:0 0 1px #999999;-moz-box-shadow:0 0 1px #999999;-o-box-shadow:0 0 1px #999999;box-shadow:0 0 1px #999999;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:-webkit-transform 0.1s ease-in;-moz-transition:-moz-transform 0.1s ease-in;-o-transition:-o-transform 0.1s ease-in;transition:transform 0.1s ease-in;background-color:#252c44;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);background-color:#252c44;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);background-color:#252c44;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg); } .label-size a:hover { color:#fff;background-color:#0c92da;-webkit-box-shadow:0 0 20px rgb(0,0,50);-moz-box-shadow:0 0 20px rgb(0,0,50);-o-box-shadow:0 0 20px rgb(0,0,50);box-shadow:0 0 10px rgb(0,0,50);-webkit-transform:rotate(3deg) scale(1.2);-moz-transform:rotate(3deg) scale(1.2);-o-transform:rotate(3deg) scale(1.2);transform:rotate(3deg) scale(1.2);-webkit-transform:rotate(-3deg) scale(1.2);-moz-transform:rotate(-3deg) scale(1.2);-o-transform:rotate(-3deg) scale(1.2);background-color:#0c92da;transform:rotate(-3deg) scale(1.2);-webkit-transform:rotate(3deg) scale(1.2);-moz-transform:rotate(3deg) scale(1.2);transform:rotate(3deg) scale(1.2);background-color:#0c92da;-webkit-transform:rotate(2deg) scale(1.2);-moz-transform:rotate(2deg) scale(1.2);background-color:#0c92da;-o-transform:rotate(2deg) scale(1.2);transform:rotate(2deg) scale(1.2); }

الشكل الثانى

كود

 HTML:.label-size a { font-size: 14px!important; padding: 1px 6px; border-top: 1px solid #CACACA; border-left: 4px solid #00A8FF; margin-bottom: 5px; float: left; margin-right: 5px; background: #F5F5F5; border-right: 1px solid #CACACA; border-bottom: 1px solid #CACACA; } .label-size a:hover { border-left: 2px solid #222222; border-right: 3px solid #222222; background: #fff; }



الشكل الثالث

كود

 HTML: .label-size a {color: #999;text-transform: uppercase;float: left;text-decoration: none;margin: 0 3px 6px 0;padding: 3px;border: solid 1px #999;border-radius: 3px;font-size: 12px;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;-webkit-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}.label-size a:hover {color: white;border: 1px solid white;-webkit-transform: rotate(360deg) scale(1) skew(1deg) translate(0px);-moz-transform: rotate(360deg) scale(1) skew(1deg) translate(0px);-ms-transform: rotate(360deg) scale(1) skew(1deg) translate(0px);-o-transform: rotate(360deg) scale(1) skew(1deg) translate(0px);}

الشكل الرابع

كود

 HTML: .label-size a {text-transform: uppercase;float: left;text-decoration: none;margin: 2px 3px 6px 0;padding: 3px;border: solid 1px #999;border-radius: 3px;font-size: 12px;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;-webkit-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}.label-size a:hover {border: 1px solid black;-webkit-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px);-moz-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px);-ms-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px);-o-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px);}

الشكل الخامس

كود

 HTML:.label-size a { text-transform: uppercase; float: left; text-decoration: none; margin: 2px 3px 6px 0; padding: 3px; border: solid 1px #999; border-radius: 3px; font-size: 12px; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; transition: all 0.3s ease-out; -webkit-transform: rotate(10deg) scale(1) skew(5deg) translate(0px); -moz-transform: rotate(10deg) scale(1) skew(5deg) translate(0px); -ms-transform: rotate(10deg) scale(1) skew(5deg) translate(0px); -o-transform: rotate(10deg) scale(1) skew(5deg) translate(0px); } .label-size a:hover { border: 1px solid black; -webkit-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px); -moz-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px); -ms-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px); -o-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px); }