ظƒظ„ظ…ط© ط§ظ„ظپط±ظٹظ‚

ظپظٹ ط¹طµط±ظ†ط§ ظٹظˆط¬ط¯ ظ…ط¦ط§طھ ط§ظ„ط¢ظ„ط§ظپ ظ…ظ† ط§ظ„ظ…ط¯ظˆظ†ظٹظ† ظˆط§ظ„ظ…ط¯ظˆظ†ط§طھ ، ط§ظ„ط¨ط¹ط¶ ظٹط¹ظ…ظ„ ط¨ط´ط؛ظپ ظˆط­ط¨ ظˆط§ظ„ط¢ط®ط± ظٹط¹ظ…ظ„ ط¨ط´ظƒظ„ ط¥ظ†طھط§ط¬ظٹ ظ„ظ„ظƒط³ط¨ ظپظ‚ط· ! ط£ظ…ط§ ظ†ط­ظ† .. ظ†ط­ط¨ ظˆظ†ط¹ط´ظ‚ ظˆظ†ط¯ظˆظˆظˆط¨ ظپظٹ ط¯ط¨ط§ط¯ظٹط¨ ط§ظ„طھط¯ظˆظٹظ† ظˆظ†ط¤ظ…ظ† ط£ظ†ظ†ط§ ط³ظ†ظ‚ظˆظ… ط¨ط¥ط¶ط§ظپط© ظƒط¨ظٹط±ط© ظ„ظ„ظ…ط­طھظˆظ‰ ط§ظ„ط¹ط±ط¨ظٹ ظˆظ„ظˆ ط¨ط´ظٹط¦ ط¨ط³ظٹط· ، ظ†طھط¹ظ„ظ… ط¨ط´ظƒظ„ ظ…ط³طھظ…ط± ظ†ط´ط§ط±ظƒظƒظ… ط¨ظƒظ„ ط¬ط¯ظٹط¯ ، ظ†ط­ط§ظˆظ„ ط§ظ„ظ…ط³ط§ط¹ط¯ط© ظ†ط­ط¨ ط£طµط¯ظ‚ط§ط،ظ†ط§ ، ظ†ظ‡طھظ… ط¨ط¥ط³طھظپط³ط§ط±ط§طھظ‡ظ… ظƒظ…ط§ ظ„ظˆ ظƒط§ظ†طھ ظ…ظ„ظƒظ†ط§، ظپط±ظٹظ‚ظ†ط§ ظپط±ظٹظ‚ ظˆط§ط­ط¯ ط±ط؛ظ… ط£ظ†ظ‡ ظ…طھظƒظˆظ† ظ…ظ† ط´ط®طµ ظˆط§ط­ط¯ :) ظ„ظƒظ†ظ‡ ظٹط¹ظ…ظ„ ط¨ط¬ظ†ظˆظ†

✖
»[بلوجر] اضافة ازرار المعاينة والتحميل احترافية

[بلوجر] اضافة ازرار المعاينة والتحميل احترافية


[بلوجر] اضافة ازرار المعاينة والتحميل احترافية

مرحبا أصدقاء موقع المطور .نت اليكم اليوم اضافة رائعة  اضافة ازرار معاينة و تحميل بشكل احترافي لمدونات بلوجر 2014 2015 , فهو من افضل ازرار التحميل والمعاينة تمتاز بالشكل الاحترافي والمميز وبتأثير جميع يمكنك استخدام الازرار في اي شئ تريد غير المعاينة والتحميل بدون اطالة اترككم مع طريقة التركيب

معاينة
إضغط للمشاهدة

تحميل مباشر
إضغط للبدء
2.3MB .rar
طريقة  التركيب

  • قم بالذهاب الى لوحة تحكم بلوجر 
  • قم بالذهاب الى قالب 
  • ثم تحرير html 
  • قم بالبحث عن  ]]></b:skin> وضع فوقة / قبلة الكود الأتي 
.whitebutton {
    margin: 20px auto;
    padding: 20px 0;
    width: 200px;
}
.whitebutton a {
    background: #fff;
    color: #666;
    display: block;
    font-size: 17px;
    font-weight: 700;
    font-family: 'Arial',Verdana,sans-serif;
    height: 50px;
    line-height: 50px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    width: 200px;
    position: relative;
    z-index: 2;
}
.whitebutton a:before {
    content: '\f019';
    font-family: FontAwesome;
    font-weight: normal;
    padding: 8px;
    margin-left: -12px;
    margin-right: 6px;
}
.whitebutton span {
    background: #444;
    color: #fff;
    display: block;
    font-size: 12px;
    font-family: 'Arial', Verdana,sans-serif;
    height: 40px;
    line-height: 40px;
    text-align: center;
    width: 200px;
    z-index: 1;
    text-transform: uppercase;
    font-weight: bold;
}
.whitebutton .up {
    background: #e25734;
    margin: -25px auto;
    opacity: 0;
    border-radius: 0 0 5px 5px;
    transform: translate(0,-50px);
    transition: 350ms;
}
.whitebutton .down {
    margin: -30px auto;
    opacity: 0;
    border-radius: 5px 5px 0 0;
    transform: translate(0,-50px);
    transition: 350ms;
}
.whitebutton .down:before {
    content:'\f14a';
    font-family: FontAwesome;
    font-weight: normal;
    margin-right: 6px;
    color: #aaa;
}
.whitebutton:hover .up {
    opacity: 1;
    transform: translate(0,0);
}
.whitebutton:hover .down {
    opacity: 1;
    transform: translate(0,-90px);
}
.whitebuttondemo {
    margin: 20px auto;
    padding: 20px 0;
    width: 200px;
}
.whitebuttondemo a {
    background: #e25734;
    color: #fff;
    display: block;
    font-size: 17px;
    font-weight: 700;
    font-family:'Arial',Verdana,sans-serif;
    height: 50px;
    line-height: 50px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    width: 200px;
    position: relative;
    z-index: 2;
    transition: 350ms;
}
.whitebuttondemo a:before {
    content:'\f002';
    font-family: FontAwesome;
    font-weight: normal;
    padding: 8px;
    margin-left: -12px;
    margin-right: 6px;
}
.whitebuttondemo a:hover {
    color: #fff;
}
.whitebuttondemo span {
    background: #444;
    color: #fff;
    display: block;
    font-size: 12px;
    font-family: 'Arial', Verdana,sans-serif;
    height: 40px;
    line-height: 40px;
    text-align: center;
    width: 200px;
    z-index: 1;
    text-transform: uppercase;
    font-weight: bold;
}
.whitebuttondemo .up {
    background: #444;
    margin: -25px auto;
    opacity: 0;
    border-radius: 0 0 5px 5px;
    transform: translate(0,-50px);
    transition: 350ms;
}
.whitebuttondemo:hover .up {
    opacity: 1;
    transform: translate(0,0);
}

بعد ذلك قم بالبحث عن </head>
  • وضع فوقة الكود الاتي 
<link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>

  • لاضافة الازرار قم بالتوجة نحو المشاركة التي تريد اضافة ازرار فيها 
  • قم بالظغط على html 
  • وقم باضافة الكود في المكان الذي تريد مع تغير الروابط 

<div class="whitebuttondemo">
      <a href="#">Demo</a>
      <span class="up">click to begin</span>
    </div>
<div class="whitebutton">
      <a href="#">Download</a>
      <span class="up">click to begin</span>
      <span class="down">1.6MB .rar</span>
    </div>



ط¹ظ†ظˆط§ظ† ط§ظ„طھط¯ظˆظٹظ†ط©: [بلوجر] اضافة ازرار المعاينة والتحميل احترافية
طھظ‚ظٹظٹظ… : 10 ظ…ظ† 10 ظ…ط±طھظƒط² ط¹ظ„ظ‰ 24 طھظ‚ظٹظٹظ….
ط§ظ„ظƒط§طھط¨ : ط£ط­ظ…ط¯ ط£ط¨ظˆط¹ط¨ظٹظ„ط© ظ…ط¯ظٹط± ظ…ظˆظ‚ط¹ ط§ظ„ظ…ط·ظˆط± .ظ†طھ
ط¹ط¯ط¯ ط§ظ„ظ…ط´ط§ظ‡ط¯ط§طھ :

طµظ†ط¯ظˆظ‚ ط§ظ„طھط¯ظˆظٹظ†ط©

ط±ط§ط¨ط· ظ…ط¨ط§ط´ط± :
ظƒظˆط¯ ظ„ظ„ظ…ظ†طھط¯ظٹط§طھ :
HTML ظƒظˆط¯ :

* ط¨ط¥ظ…ظƒط§ظ†ظƒ ط¥ط¯ط±ط§ط¬ ط§ظ„ط£ظƒظˆط§ط¯ ط§ظ„ط؛ظٹط± ظ‚ط§ط¨ظ„ط© ظ„ظ†ط´ط± ط¨طھط­ظˆظٹظ„ظ‡ ط¹ط¨ط± ظ…ط­ظˆظ„ ط§ظ„ط£ظƒظˆط§ط¯

طھط­ظˆظٹظ„ ط§ظ„ط£ظƒظˆط§ط¯ط¥ط؛ظ„ط§ظ‚ ط§ظ„طھط¹ط¨ظٹط±ط§طھط¥ط®ظپط§ط،

ط´ظƒط±ط§ ظ„طھط¹ظ„ظٹظ‚ظƒ
ظ‚ط§ظ„ط¨ ط¨ط¯ط§ظٹط© .. ظ†ظ‚ط·ط© .

ط§ظ„ظ…ط·ظˆط± .ظ†طھ © 2014, ط¬ظ…ظٹط¹ ط§ظ„ط­ظ‚ظˆظ‚ ظ…ط­ظپظˆط¸ط©