17038183816075180
random
أخبار ساخنة

تركيب اضافة اظهار الروابط الإحترافية 2018

الخط
وجدان للمعلوميات
تركيب اضافة اظهار الروابط الإحترافية 2018
 السلام عليكم احبتنا الكرام اليوم و كما وعدناكم سابقا موعدنا مع طريقة حصرية لتركيب اضافة اظهار الروابط المنبثقة الإحترافية , طباع الإضافة مدفوعة اليوم نضعها بين ايديكم مجانا بدون اطالة نمر لطريقة التركيب 

صور الإضافة : 


معاينة الإضافة : من هنا

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


1- اضافة اكواد css : ادخل للمظهر ثم تحرير html اضغط ctrl+f و ابحث عن هذا الوسم  </b:skin> وضع الكود التالي فوقه مباشرة


/*
NEW SYSTEM OF DOWNLOADING BUTTONS
*/
#outer_page_btn {
    background-color: #562d98;
    color: #fff;
    display: inline-block;
    padding: 10px 25px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    font-size: 20px;
    cursor: pointer;
 box-shadow: inset 0px 0px 0px 0px #562d98;
    -webkit-box-shadow: inset 0px 0px 0px 0px #562d98;
    -moz-box-shadow: inset 0px 0px 0px 0px #562d98;
    -o-box-shadow: inset 0px 0px 0px 0px #562d98;
    -ms-box-shadow: inset 0px 0px 0px 0px #562d98;
 transition: all .2s ease-out;
    -webkit-transition: all .2s ease-out;
    -moz-transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    -ms-transition: all .2s ease-out;
    margin: 30px 0;
}
#outer_page_btn:before {
    font-family: "FontAwesome";
    content: "\f0c1";
    padding: 0 0 0 20px;
}
#outer_page_btn:hover {
    box-shadow: inset 0px -50px 0px 0px #ef69e4;
    -webkit-box-shadow: inset 0px -50px 0px 0px #ef69e4;
    -moz-box-shadow: inset 0px -50px 0px 0px #ef69e4;
    -o-box-shadow: inset 0px -50px 0px 0px #ef69e4;
    -ms-box-shadow: inset 0px -50px 0px 0px #ef69e4;
}
#outer_page_cont {
    background: linear-gradient(to right,#c31284, #ff6ce6,#a9196f);
    background: -webkit-linear-gradient(to right,#c31284, #ff6ce6,#a9196f);
    background: -moz-linear-gradient(to right,#c31284, #ff6ce6,#a9196f);
    background: -o-linear-gradient(to right,#c31284, #ff6ce6,#a9196f);
    background: -ms-linear-gradient(to right,#c31284, #ff6ce6,#a9196f);
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 99999999;
    transform: scale(0);
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -o-transform: scale(0);
    -ms-transform: scale(0);
 overflow-y: auto;
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s;
    -ms-transition: all .3s;
}
.outer_page_cont {
    transform: scale(1) !important;
    -webkit-transform: scale(1) !important;
    -moz-transform: scale(1) !important;
    -ms-transform: scale(1) !important;
    -o-transform: scale(1) !important;
}
#outer_top {
    width: 100%;
    height: 90px;
    padding: 20px;
    margin: 0 0 50px 0;
    position: relative;
    top: 0;
    box-sizing: border-box;
    background: #5f0404;
    border-bottom: 5px solid #562d98;
}
.outer_page_control {
    color: #ffffff;
    background: #562d98;
    padding: 5px 20px;
    border-radius: 25px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    -o-border-radius: 25px;
    -ms-border-radius: 25px;
    cursor: pointer;
    float: right;
}
#outer_top .share a {
    width: 43px;
    height: 43px;
    display: block;
    float: right;
    margin: 0 10px 0 0;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -o-border-radius: 20px;
    -ms-border-radius: 20px;
    color: #ffffff;
    font-size: 25px;
    text-align: center;
    background: #562d98;
}
#outer_top .share a:hover {
    color: #ffffff;
    background: #da48b3;
}
#outer_top .share a i {
    line-height: 43px;
}
.outer_page_control:hover {
    color: #5f0404;
    background: #ffffff;
}
.outer_page_control:before {
    font-family: "FontAwesome";
    content: "\f0e2";
    margin: 0 0 0 15px;
    display: inline-block;
    transform: rotate(50deg);
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    transition: all .5s;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    -ms-transition: all .5s;
}
.outer_page_control:hover:before {
    transform: rotate(-80deg);
    -webkit-transform: rotate(-80deg);
    -moz-transform: rotate(-80deg);
    -o-transform: rotate(-80deg);
    -ms-transform: rotate(-80deg);
}
#outer_page_cont .widget-content {
    margin: 20px;
    color: #fff;
}
#outer_page_table {
    border-collapse: collapse;
 color:#fff;
 font-size: 15px;
 width:80%;
 display:none;
    margin: 0 0 50px 0; 
}


.t_off{
 display:none;
  }

#outer_page_table td {
    border: 1px solid #dddddd;
    text-align: center;
    margin:0 -1px 0 0;
    padding: 5px;
}
#outer_page_table th {
    border: 1px solid #ddd;
    background: #562d98;
}
#t_timer {
    font-size: 20px;
    text-align: center;
    color: #fff;
    border: 2px solid #fff;
    width: 150px;
    height: 150px;
    line-height: 150px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    margin: 30px auto;
}

.t_title{
min-width:300px;
}
.t_version{
min-width:100px;
max-width:150px;
}
.t_size{
min-width:100px;
max-width:150px;
}
.t_download h2, .t_download h3, .t_download h4 {
    font-weight: 100;
    margin: 0;
    padding: 0;
    line-height: 15px;
 text-align: center;
}
.t_download h2 a {
    color: #fff;
    background-color: #018ad2;
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid #026cba;
    border-radius: 4px;
}
.t_download h2 a:hover {
    color: #fff;
    background-color: #0272bf;
    border-color: #0355a8;
}

.t_download h3 a {
    color: #fff;
    background-color: #30bbf1;
    display: inline-block;
    padding: 6px 12px;
    margin: 5px 2px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 2px solid #227770;
    border-radius: 25px;
}
.t_download h3 a:hover {
    color: #fff;
    background-color: #2e95bd;
    border-color: #134061;
}
.t_download h3 a:before, .t_download h4 a:before {
    font-family: "FontAwesome";
    content: "\f019";
    float: right;
    padding: 0 0 0 10px;
}
.t_download h2 a:before {
    font-family: "FontAwesome";
    content: "\f06e";
    padding: 0 10px 0 0;
    font-size: 15px;
}


.t_download h4 a {
    color: #fff;
    background-color: #d000ef;
    display: inline-block;
    padding: 6px 12px;
    margin: 5px 2px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 2px solid #7f4180;
    border-radius: 25px;
}
.t_download h4 a:hover {
    color: #fff;
    background-color: #bb20e2;
    border-color: #491e54;
}
.outer_page_cont .PopularPosts h2 {
    width: 200px;
    box-sizing: border-box;
    margin: 0 auto;
    background-color: #ce448e;
    color: #fff;
    text-align: center;
    font-size: 18px;
    font-weight: 100;
    padding: 10px 5px;
    border-radius: 20px;
 -webkit-border-radius: 20px;
}
.outer_page_cont .PopularPosts .popular-posts ul li {
    width: 47%;
    float: right;
    margin: 0 0 25px 2.5%;
    padding: 10px 0;
    background-color: rgba(249, 60, 126, 0.38);
    border-radius: 40px;
 -webkit-border-radius: 40px;
 transition: all .5s ease;
 -webkit-transition: all .5s ease;
 box-shadow: 0px 0px 0px 0px rgba(66, 18, 76, 0.5);  
 -webkit-box-shadow: 0px 0px 0px 0px rgba(66, 18, 76, 0.5);  
    border: 1px solid #8e2660;
}
.outer_page_cont .PopularPosts .popular-posts ul li:hover {
    box-shadow: 0px 0px 45px 10px rgba(66, 18, 76, 0.5);  
 -webkit-box-shadow: 0px 0px 45px 10px rgba(66, 18, 76, 0.5);  
}
.outer_page_cont .PopularPosts .popular-posts ul li a {
    color: #fff;
}
.outer_page_cont .PopularPosts .popular-posts ul .item-thumbnail {
    float: right;
    margin: 0 0 0 15px;
}

#outer_page_table h3 img, #outer_page_table h4 img {
    display: none;
}

/*popular posts*/
.outer_page_cont .popular-posts ul {
list-style: none;
}
.outer_page_cont .popular-posts li img {
border-radius:100%;
}

2- اضافة اكواد HTML ابحث بداخل القالب عن هذا الوسم <body> و الصق الكود تالي اسفله  مباشرة

<!--NEW SYSTEM OF DOWNLOADING BUTTONS-->
<div id='outer_page_cont'>
<div id='outer_top'>
<div class='outer_page_control' onclick='close_outer_page()'>الرجوع للموضوع</div>
<div class='share'>
<a href='رابط ايقونة الفيس بوك' target='_blank'><i class='fa fa-facebook'/></a>
<a href='رابط ايقونة تويتر' target='_blank'><i class='fa fa-twitter'/></a>
<a href='رابط ايقونة اليوتيوب' target='_blank'><i aria-hidden='true' class='fa fa-youtube-play'/></a>
<a href='رابط ايقونة جوجل بلس' target='_blank'><i class='fa fa-google-plus'/></a>
<a href='http://www.tumblr.com/share/link?url=' target='_blank'><i class='fa fa-tumblr'/></a>
<a href='http://pinterest.com/pin/create/button/?source_url=' onclick='javascript:window.open(this.href, &apos;&apos;, &apos;menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600&apos;);return false;' target='_blank'><i class='fa fa-pinterest'/></a>
</div>
</div>
<div class='section' id='top_outer_ad'>
</div>
<div id='outer_replace_part'/>
<b:section id='bottom_outer_ad' showaddelement='yes'>
  <b:widget id='PopularPosts4' locked='false' title='قد يهمك أيضا' type='PopularPosts'>
    <b:widget-settings>
      <b:widget-setting name='numItemsToShow'>6</b:widget-setting>
      <b:widget-setting name='showThumbnails'>true</b:widget-setting>
      <b:widget-setting name='showSnippets'>false</b:widget-setting>
      <b:widget-setting name='timeRange'>LAST_YEAR</b:widget-setting>
    </b:widget-settings>
    <b:includable id='main'>
  <b:if cond='data:title != &quot;&quot;'><h2><data:title/></h2></b:if>
  <div class='widget-content popular-posts'>
    <ul>
      <b:loop values='data:posts' var='post'>
      <li>
        <b:if cond='!data:showThumbnails'>
          <b:if cond='!data:showSnippets'>
            <!-- (1) No snippet/thumbnail -->
            <a expr:href='data:post.href'><data:post.title/></a>
          <b:else/>
            <!-- (2) Show only snippets -->
            <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
            <div class='item-snippet'><data:post.snippet/></div>
          </b:if>
        <b:else/>
          <!-- (3) Show only thumbnails or (4) Snippets and thumbnails. -->
          <div expr:class='data:showSnippets ? &quot;item-content&quot; : &quot;item-thumbnail-only&quot;'>
            <b:if cond='data:post.featuredImage.isResizable or data:post.thumbnail'>
              <div class='item-thumbnail'>
                <a expr:href='data:post.href' target='_blank'>
                  <b:with value='data:post.featuredImage.isResizable                                  ? resizeImage(data:post.featuredImage, 72, &quot;1:1&quot;)                                  : data:post.thumbnail' var='image'>
                    <img alt='' border='0' expr:src='data:image'/>
                  </b:with>
                </a>
              </div>
            </b:if>
            <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
            <b:if cond='data:showSnippets'>
              <div class='item-snippet'><data:post.snippet/></div>
            </b:if>
          </div>
          <div style='clear: both;'/>
        </b:if>
      </li>
      </b:loop>
    </ul>
    <b:include name='quickedit'/>
  </div>
</b:includable>
  </b:widget>
</b:section>
  </div>
3- اضافة اكواد javascript ابحث بداخل القالب عن هذا الوسم </body> و الصق الكود تالي فوقه مباشرة

<script type='text/javascript'>
/*<![CDATA[*/
var outer_quote = document.getElementsByClassName('post-body')[0].getElementsByTagName('blockquote');
for(i = 0 ; i < outer_quote.length ; i++){
 if(outer_quote[i].innerHTML.search('#صف') != -1){
   outer_quote[i].setAttribute('id' , 'outer_page');
       };
};

if(document.getElementById('outer_page') != undefined){
var outer_page_element = document.getElementById('outer_page_cont');
var outer_page = document.getElementById('outer_page');
$('#outer_page').replaceWith("<center><br/><div id='outer_page_btn' onclick='open_outer_page()'>&#11015; عرض روابط التحميل &#11015;</div><br/></center>");
$('#outer_replace_part').replaceWith("<div id='outer_table'><div id='t_timer'>فضلا&#1611; أنتظر ...</div><div class='t_off'>" + outer_page.innerHTML + "</div></div>");
};



var x_timer = 5;
  function begin_timer(){
var t_interval = setInterval(function(){
if(x_timer < 1){
  clearInterval(t_interval);
var outer_table = document.getElementById('outer_table');
var outer_table_cont = outer_table.innerHTML;
var outer_table_cont_array = outer_table_cont.split('*');
var no_of_lines = outer_table_cont_array.length / 5;
var t_txt = '';
for(i = 0 ; i < no_of_lines ; i++){
var t_x = outer_table_cont.split('#صف')[i + 1];
var t_y = t_x.split('*');
 t_txt += "<tr><td class='t_title'>" + t_y[1] + "</td><td class='t_version'>" + t_y[3] + "</td><td class='t_size'>" + t_y[2] + "</td><td class='t_download'>" + t_y[4] + "</td></tr>";
};
document.getElementById('outer_table').innerHTML = "<center><table id='outer_page_table'><tr><th>اسم الملف</th><th>الإصدار</th><th>حجم الملف</th><th>روابط التحميل</th></tr>" + t_txt + "</table></center>";
document.getElementById('outer_page_table').style.display = 'inline-table';
$('#outer_page_table br').replaceWith('');
  };
document.getElementById('t_timer').innerHTML = x_timer;
x_timer--;
    } , 1000);
  };

function close_outer_page(){
outer_page_element.classList.remove('outer_page_cont');   
};
function open_outer_page(){
outer_page_element.setAttribute('class','outer_page_cont');
begin_timer();
};
/*]]>*/
</script>

4-اخيرا : اضافة اكواد الاضافة و ورابط التحميل بداخل التدوينة قم بنسخ الكود التالي ووضعه في اي تدوينة تريد ان تظهر بها الإضافة طباع بعد تغيير الروابط و الووصف بما يناسب الكود التالي تستعمله لكل رابط تريد اضافته


<div style="text-align: center;">
            <div style="background-color: white; box-sizing: border-box;">
                <blockquote class="tr_bq">
                    <div style="text-align: center;">
                        <blockquote class="tr_bq">
                            <div style="text-align: center;">
                                <blockquote>
                                    <div style="text-align: center;"><b><span style="font-family: inherit;">#صف</span></b></div><b></b><br />
                                    <div style="text-align: center;"><b><b><span style="font-family: inherit;">*</span></b></b>
                                    </div><b></b><b></b><br />
                                    <div style="text-align: center;"><b><b><span style="font-family: inherit;">wejdane_Transition_Presets_v2.rar</span></b></b>
                                    </div><b></b><b></b><br />
                                    <div style="text-align: center;"><b><b><span style="font-family: inherit;">*</span></b></b>
                                    </div><b></b><b></b><br />
                                    <div style="text-align: center;"><b><b><span style="font-family: inherit;">23.50KB</span></b></b>
                                    </div><b></b><b></b><br />
                                    <div style="text-align: center;"><b><b><span style="font-family: inherit;">*</span></b></b>
                                    </div><b></b><b></b><br />
                                    <div style="text-align: center;"><b><b><span style="font-family: inherit;">2018-03-20 18:05:11</span></b></b>
                                    </div><b></b><b></b><br />
                                    <div style="text-align: center;"><b><b><span style="font-family: inherit;">*</span></b></b>
                                    </div><b></b><br />
                                    <h3 style="text-align: center;"><b><span style="font-family: inherit;"><a href="https://www.file4.net/f-srF">File4Net</a></span></b></h3>
                                    <h4 style="text-align: center;"><b><span style="font-family: inherit;"><a href="http://speed4up.com/f805f0c9c479ff3a">Speed4Up</a></span></b></h4>
                                    <h3 style="text-align: center;"><b><span style="font-family: inherit;"><a href="https://www.file-upload.com/wmyox4x9axo6">File-Upload</a></span></b></h3>
                                </blockquote>
                            </div>
                        </blockquote>
                    </div>
                </blockquote>
            </div>
        </div>
  1. الردود
    1. تم اضافة زر معاينة للإضافة في الموضوع . شكرا للملاحظة اخي الكريم

      حذف
  2. اخي عماد شكرا على الشرح الرائع
    لكن لم اجد وسم < body > في قالبي قالب المعدل من طرفك (قالب سكودة)

    ردحذف
    الردود
    1. ابحث هكذا body لا تضع وسم <> ستجده احينا يكون مضاف اليه index ....

      حذف
  3. لم اجد ال body الان مذا افعل

    ردحذف
  4. أزال المؤلف هذا التعليق.

    ردحذف
  5. ملقتش ال body خالص

    ردحذف

إرسال تعليق

إدعمنا بتعليقك ومشاركتك للموضوع . وشكرا

نموذج الاتصال
الاسمبريد إلكترونيرسالة