الحلقة 18: طريقة اضافة قائمة لمدونتك احترافية بتقنية الـ Css

العودة للصفحة الرئيسية » بلوجر » الحلقة 18: طريقة اضافة قائمة لمدونتك احترافية بتقنية الـ Css

الحلقة 18: طريقة اضافة قائمة لمدونتك احترافية بتقنية الـ Css

شاهد:

الــسـلام عـلـيـكـم ورحـمـة الــلـه وبــركـاتـه

الحلقة 18: طريقة اضافة قائمة لمدونتك احترافية بتقنية الـ Css

اولا : اذهب الى لوحة تحكم مدونتك ثم اضغط على قالب ثم اضغط على تحرير HTML

وقم بالبحث عن

]]></b:skin>

ثم قبله مباشرة اضف هذا الكود

<#navigationMenu span{     /* Container properties */     width:0;     left:38px;     padding:0;     position:absolute;     overflow:hidden;      /* Text properties */     font-family:'Myriad Pro',Arial, Helvetica, sans-serif;     font-size:18px;     font-weight:bold;     letter-spacing:0.6px;     white-space:nowrap;     line-height:39px;      /* CSS3 Transition: */     -webkit-transition: 0.25s;      /* Future proofing (these do not work yet): */     -moz-transition: 0.25s;     transition: 0.25s; }  #navigationMenu a{     /* The background sprite: */     background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjg4lFnvr4KACPTlluOB3aNejsHNXvY0RWAPpy4mL-f3llL1F883GJElD4-nOZhn2aaFRKWWAT1nr9bYvBabyYy_xKeQw-p5IdsQ2W5XHiST5iuFeL-EYM_HB0UHAuMglfFGkoq39UGmE/s1600/navigation.jpg') no-repeat;      height:39px;     width:38px;     display:block;     position:relative; }  /* General hover styles */  #navigationMenu a:hover span{ width:auto; padding:0 20px;overflow:visible; } #navigationMenu a:hover{     text-decoration:none;      /* CSS outer glow with the box-shadow property */     -moz-box-shadow:0 0 5px #9ddff5;     -webkit-box-shadow:0 0 5px #9ddff5;     box-shadow:0 0 5px #9ddff5; } /* Green Button */  #navigationMenu .home {    background-position:0 0;} #navigationMenu .home:hover {    background-position:0 -39px;} #navigationMenu .home span{     background-color:#7da315;     color:#3d4f0c;     text-shadow:1px 1px 0 #99bf31; }  /* Blue Button */  #navigationMenu .about { background-position:-38px 0;} #navigationMenu .about:hover { background-position:-38px -39px;} #navigationMenu .about span{     background-color:#1e8bb4;     color:#223a44;     text-shadow:1px 1px 0 #44a8d0; }  /* Orange Button */  #navigationMenu .services { background-position:-76px 0;} #navigationMenu .services:hover { background-position:-76px -39px;} #navigationMenu .services span{     background-color:#c86c1f;     color:#5a3517;     text-shadow:1px 1px 0 #d28344; }  /* Yellow Button */  #navigationMenu .portfolio { background-position:-114px 0;} #navigationMenu .portfolio:hover{ background-position:-114px -39px;} #navigationMenu .portfolio span{     background-color:#d0a525;     color:#604e18;     text-shadow:1px 1px 0 #d8b54b; }  /* Purple Button */  #navigationMenu .contact { background-position:-152px 0;} #navigationMenu .contact:hover { background-position:-152px -39px;} #navigationMenu .contact span{     background-color:#af1e83;     color:#460f35;     text-shadow:1px 1px 0 #d244a6; }</a>

ثانيا : قم بالذهاب الى التخطيط ثم اضف اداة جديد (يجب ان تكون اعلى رسائل المدونة الالكترونية)

ثم اختر اداة

HTML/Javascript

واضف فيه هذا الكود

ثم استبدل YOUR URL برابط الخاص بك

مدونة تجريبية

ما رأيك في القالب

اقسام

مدونة المخزن

مدونة المخزن

مدونة المخزن

مدونة المخزن

مدونة المخزن

مدونة المخزن

المتابعون

اخر المواضيع

تبادل اعلاني

للتصفح الافضل

اخر التعليقات

تابعنا على الفيسبوك

التسميات

من أنا

الحلقة 18: طريقة اضافة قائمة لمدونتك احترافية بتقنية الـ Css

0 التعليقات:

إرسال تعليق

صفحات

قسم بلوجر

مدونات صديقة

المتواجدين الان

اعلانات