قائمة ثلاثية التبويت لتعريف الكاتب والقائمة البريدية ومواضيع ذات صله احترافيه

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

شرح التركيب

قم بالبحث عن هذا الوسم فى مدونتك

</head>

ثم ضع فوقه الكود التالى.

اذا لم تجده أبحث عن هكذا فقط

/head

ثم ضع فوقه الكود التالى .

<script type='text/javascript'> //<![CDATA[ var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();function related_results_labels(json){for(var i=0;i<json.feed.entry.length;i++){var entry=json.feed.entry[i];relatedTitles[relatedTitlesNum]=entry.title.$t;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){relatedUrls[relatedTitlesNum]=entry.link[k].href;relatedTitlesNum++;break;}}}} function removeRelatedDuplicates(){var tmp=new Array(0);var tmp2=new Array(0);for(var i=0;i<relatedUrls.length;i++){if(!contains(tmp,relatedUrls[i])){tmp.length+=1;tmp[tmp.length-1]=relatedUrls[i];tmp2.length+=1;tmp2[tmp2.length-1]=relatedTitles[i];}} relatedTitles=tmp2;relatedUrls=tmp;} function contains(a,e){for(var j=0;j<a.length;j++)if(a[j]==e)return true;return false;} function printRelatedLabels(){var r=Math.floor((relatedTitles.length-1)*Math.random());var i=0;document.write('<ul>');while(i<relatedTitles.length&&i<20){document.write('<li><a href="'+relatedUrls[r]+'">'+relatedTitles[r]+'</a></li>');if(r<relatedTitles.length-1){r++;}else{r=0;} i++;} document.write('</ul>');document.write('<a href="" target="_blank"><font size="1" color="black"></font></a>');} //]]> </script> <style> /* CSS Tabs */ .tabs{background:#fff;width:100%;max-width:100%;float:none;list-style:none;padding:20px 0 0 0;margin:auto;display:table;overflow:hidden;} .tabs:after{content:'';display:table;clear:both} .tabs input[type=radio]{display:none} .tabs label{background:#f6f6f6;display:table-cell;float:left;width:33.3333%;color:#222;padding:12px;font-size:1.2rem;font-weight:500;text-align:center;cursor:pointer;border-top:1px solid rgba(0,0,0,0.15);border-bottom:1px solid rgba(0,0,0,0.15);border-left:1px solid rgba(0,0,0,0.15);transition:all 0.3s} .tabs label:nth-of-type(1){border-left:0} .tabs label i{padding:5px;margin-right:0} .tab-content{display:none;width:100%;float:left} .tabs [id^="tab"]:checked + label,.tabs label:hover{background:#fff;color:#e74c3c} #tab1:checked ~ #tab-content1,#tab2:checked ~ #tab-content2,#tab3:checked ~ #tab-content3{display:block} /* CSS Multi Author Box */ .authorboxwrap{margin:auto;padding:20px;overflow:hidden} .avatar-container{background:rgba(0,0,0,.03);float:right;margin:0 0 0 20px;border-radius:6px;overflow:hidden} .avatar-container img{width:100px;height:100px;max-width:100%!important;transition:all .3s ; border-radius: 6px;} .author_description_container h4{font-size:18px;display:block;margin:0;margin-bottom:2px} .author_description_container h4 a{color:#000} .author_description_container p{margin:0;font-size:14px;margin-bottom:8px;line-height:22px;font-weight:400} .author_description_container p a{color:#0279c5;}.author_description_container p a:hover{color:#000;text-decoration:underline} .social-links li{list-style:none!important;float:right} .social-links a{border-bottom:none} .social-links a:after,.social-links a:before{content:none!important} .social-links li a{background:#3498db;color:#fff;font-size:12px;text-align:center;display:inline-block;padding:9px 4px;margin:0 0 0 10px;width:32px;border-radius:2px} .social-links li a:hover{background:#2980b9;color:#fff;} /* Subscribe Footer */ #subscriber-foot{display:block;overflow:hidden;margin:0 auto;text-align:center;padding:20px;} #subscriber-foot p{margin:1em 0} #subscriber-foot .emailfooter{margin:auto;text-align:center;} #subscriber-foot .emailfooter form{margin:0;padding:0;} #subscriber-foot .emailfooter input{width:100%;background:rgba(255,255,255,1);padding:12px;color:#999;font-size:14px;margin-bottom:20px;border:1px solid rgba(0,0,0,0.3);transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s} #subscriber-foot .emailfooter input:hover{border-color:rgba(0,0,0,.24);} #subscriber-foot .emailfooter input:focus{color:#000;outline:none;border-color:#66afe9;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,0.6);} #subscriber-foot .emailfooter .submitfooter{background:#7f8c8d;color:#fff;font-size:14px;cursor:pointer;border:0;border-radius:3px;overflow:hidden;transition:all .3s;padding:14px} #subscriber-foot .emailfooter .submitfooter:hover{background:#e67e22;color:#fff;outline:none;box-shadow:none} #subscriber-foot .emailfooter .submitfooter:active{color:#fff;outline:none;box-shadow:none} /* Arlina Related Post */ #related-post {margin:0;padding:20px 0 0 0;} #related-post h4{display:none;color:#111;border-bottom:1px solid rgba(0,0,0,0.15);border-top:1px solid rgba(0,0,0,0.15);padding:10px 0;font-size:20px;margin:0 0 20px 0;padding-left:8px;line-height:1em} #related-post h4 span{padding:6px;display:inline-block;vertical-align:middle} .relhead {background:#fff;font-size:100%;font-weight:normal;line-height:150%;overflow:hidden;padding:0;} ul#related-summary {margin:0;padding:0 15px;} ul#related-summary li{position:relative;float:left;list-style:none outside none;margin:0 5px 15px 5px;padding:0;overflow:hidden;height:180px;width:31.6%} ul#related-summary li img{background-color:#f1f1f1;width:100%;height:auto;max-width:100%;margin:0 auto;vertical-align:middle;} ul#related-summary li a.relinkjdulx{color:#000;display:block;font-size:14px;font-weight:400;line-height:normal;overflow:hidden;text-align:left;padding:10px 10px 10px 0} ul#related-summary li a.relinkjdulx:hover{color:#0279c5;} .overlayb {position:relative;max-height:140px;overflow:hidden;} .overlayb:before{content:'';background-color:rgba(0,0,0,0.4);position:absolute;text-align:center;top:0;left:0;right:0;bottom:0;z-index:2;opacity:0;visibility:hidden;transition:all 0.1s} .overlayb:after{content:'\f002';font-family:fontawesome;font-size:1.3rem;color:rgba(255,255,255,.8);position:absolute;top:45%;left:45%;text-align:center;z-index:2;opacity:0;visibility:hidden;transition:all 0.1s} .overlayb:hover:before,.overlayb:hover:after {opacity:1;visibility:visible;} #related-posts{margin-left:0;font-weight:100;background-color:#fff;padding:12px} #related-posts ul li{display:block;margin:0;padding-top:0;padding-right:0;padding-bottom:1px;padding-left:21px;margin-bottom:5px;line-height:2em} #related-posts ul li:before{content:'\f0a8';float:right;font-family:fontawesome;position:relative;top:9px;margin-left:8px;margin-right:8px;color:#fff;background:#465769;width:22px;text-align:center;height:22px;font-size:14px;line-height:22px;border-radius:50%} </style>

الأن قم سوف تضع الكود التالى فى مكان ما تريدها فى مدونتك
ويمكنك وضعه اسفل أو فوق مواقع التواصل فى مدونتك

<b:if cond='data:blog.pageType == "item"'> <div id='related-posts'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != "true"'> </b:if> <b:if cond='data:blog.pageType == "item"'> <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=6"' type='text/javascript'/></b:if></b:loop><a href='http://add-b.blogspot.com/2013/08/related-posts-for-blogger-widget.html'> <img style='border: 0'/></a><h2/> <script type='text/javascript'> var maxresults=10; removeRelatedDuplicates(); printRelatedLabels("<data:post.url/>"); </script> </div> <div class='tabs'> <input id='tab3' name='tabs' type='radio'/> <label for='tab3'> <b:if cond='data:blog.isMobileRequest == "true"'><i aria-hidden='true' class='fa fa-envelope'/></b:if><span>القائمة البريدية</span> </label> <input id='tab2' name='tabs' type='radio'/> <label for='tab2'> <b:if cond='data:blog.isMobileRequest == "true"'><i aria-hidden='true' class='fa fa-user'/></b:if><span>الكاتب</span> </label> <input checked='' id='tab1' name='tabs' type='radio'/> <label for='tab1'> <b:if cond='data:blog.isMobileRequest == "true"'><i aria-hidden='true' class='fa fa-external-link-square'/></b:if><span>مواضيع ذات صله</span> </label> <div class='tab-content' id='tab-content1'> <h3></h3> <div class='clear'/> <div id='related-posts'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != "true"'> </b:if> <b:if cond='data:blog.pageType == "item"'> <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=6"' type='text/javascript'/></b:if></b:loop><a href='http://add-b.blogspot.com/2013/08/related-posts-for-blogger-widget.html'> <img style='border: 0'/></a><h2/> <script type='text/javascript'> var maxresults=10; removeRelatedDuplicates(); printRelatedLabels("<data:post.url/>"); </script> </div> <div class='clear'/> </div>  <div class='tab-content' id='tab-content2'> <h3></h3> <div class='authorboxwrap'> <div class='authorboxfull'> <div class='avatar-container'> <a href=''> <img class='ripplelink author_avatar' expr:alt='data:post.author' expr:src='data:post.authorPhoto.url' expr:title='data:post.author' height='90' width='90'/> </a> </div> <div class='author_description_container'> <h4><a href='#' rel='author'><data:post.author/></a> <i class='fa fa-check-circle' style='color:#e74c3c;font-size:16px;margin:0 0 0 3px' title='Verified Author'/></h4> <p> <data:post.authorAboutMe/> </p> <span class='social-links'> <li><a class='ripplelink external external-link' href='#' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a></li> <li><a class='ripplelink external external-link' href='#' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a></li> <li><a class='ripplelink external external-link' href='#' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a></li> </span> </div> </div> </div> </div>  <div class='tab-content' id='tab-content3'> <h3></h3> <div class='footer-menu' id='subscriber-foot'> <h3>أشترك معنا الأن</h3> <p>أشترك معنا الأن للحصل على اخر الأخبار أول بأول</p> <div class='emailfooter'> <form action='https://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('https://feedburner.google.com/fb/a/mailverify?uri=Blog-SimplifyNew', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'> <input name='email' onblur='if (this.value == "") {this.value = "Email address";}' onfocus='if (this.value == "Email address") {this.value = "";}' type='text' value='ضع اييملك هنا'/> <input name='uri' type='hidden' value='SimplifyNew'/> <input name='loc' type='hidden' value='en_US'/> <input class='ripplelink submitfooter' type='submit' value='أشراك'/> </form> </div> </div> </div> </div> </b:if>