‏إظهار الرسائل ذات التسميات موسوعة البلوجر. إظهار كافة الرسائل
‏إظهار الرسائل ذات التسميات موسوعة البلوجر. إظهار كافة الرسائل

الأربعاء، 11 أكتوبر 2017

أسهل طريقة لإضافة سلايدشو إحترافي الإصدار الثاني يقوم بعرض مواضيع المدونه تلقائيا

أسهل طريقة لإضافة سلايدشو إحترافي الإصدار الثاني يقوم بعرض مواضيع المدونه تلقائيا

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




في البداية يمكنك معاينة السلايد شو على الموقع التالي :

طريقة التركيب : 

أولا قم بتحرير القالب ثم Ctrl+f و ابحث عن وسم ]]></b:skin>  و ضع الكود التالي قبله :

.randompost{padding:1% 0}.randompost ul li{float:right;width:25%;padding:0;box-sizing:border-box;position:relative}.randomimg{overflow:hidden;background:#333;transition:all 1s ease;-moz-transition:all .8s ease;-ms-transition:all .8s ease;-webkit-transition:all .8s ease;-o-transition:all .8s ease}.randomimg:hover{background:#33b242}.randompost ul li:nth-child(1){height:420px;width:50%}.randompost ul li:nth-child(2){height:209.5px;width:50%}.randompost ul li:nth-child(1) .randomimg,.randompost ul li:nth-child(1) .rcp-thumb{height:420px}.randompost ul li:nth-child(1) .randomimg{margin-left:1px}.randompost ul li:nth-child(4) .randomimg{margin-top:1px}.randompost ul li:nth-child(3) .randomimg{margin-top:1px;margin-left:1px}.rcp-thumb{width:100%;height:209.5px;position:relative;display:block;overflow:hidden;opacity:.3!important;transition:all 1s ease;-moz-transition:all .8s ease;-ms-transition:all .8s ease;-webkit-transition:all .8s ease;-o-transition:all .8s ease;transform:scale(1.5);-moz-transform:scale(1.5);-webkit-transform:scale(1.5);-o-transform:scale(1.5);-ms-transform:scale(1.5);-webkit-filter:blur(3px);-moz-filter:blur(3px);-o-filter:blur(3px);-ms-filter:blur(3px);filter:blur(3px)}.columns:hover .rcp-thumb{transform:scale(1);-moz-transform:scale(1);-webkit-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);-webkit-filter:blur(1px);-moz-filter:blur(2px);-o-filter:blur(2px);-ms-filter:blur(2px);filter:blur(2px)}.rcp-thumb:after{content:no-close-quote;position:absolute;left:0;bottom:0;width:100%;height:135px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc-YrQwSysXC9x3CAydwhi7yovVA5xCZdBxcbdI6Gzs5k6S21bIsqD_2OtZxFDNj2XlfXWFYhYFgQaEYg7N0CbUmtr4mJqO8930Zl73kH6rqT6iiFTkvhBvSlL1jJXGMKImXsp2noEOMk/s1600-r/metabg.png) repeat-x;opacity:.8;background-size:100% 100%;overflow:hidden}.featured-overlay{position:absolute;left:0;top:0;z-index:1;width:100%;height:100%;background-color:rgba(40,35,40,0.05)}.re-tag .tag{position:absolute;top:15px;right:15px;background-color:#243748;color:#fefefe;text-transform:uppercase;font-weight:400;z-index:5;height:25px;line-height:25px;padding:0 5px;font-size:11px}.post-panel{position:absolute;bottom:0;right:0;width:100%;padding:15px;z-index:2;box-sizing:border-box}h3.rcp-title{font-size:16px;position:relative;margin-bottom:8px}.rcp-title a{color:#fefefe;font-weight:500;position:relative;line-height:1.4em;text-shadow:0 1px 1px rgba(0,0,0,0.5)}.re-ps{font-size:12px;color:#ccc;font-weight:400}.re-ps .recent-date i{margin-left:5px}

الاَن قم بالبحث عن وسم </head> او /head وضع الكود التالي قبله ( فوقه)

<script type='text/javascript'>
//<![CDATA[
function postbylabel(a){document.write("<ul class='labelposts'>");for(var b=0;b<a.feed.entry.length;b++){for(var c=a.feed.entry[b],d=0;d<c.link.length;d++)if("alternate"==c.link[d].rel){var e=c.link[d].href;break}var f=c.title.$t,g=c.category[0].term,h=c.author[0].name.$t,j=c.content.$t,k=c.published.$t,l=k.substring(0,4),m=k.substring(5,7),n=k.substring(8,10),o=[,"يناير ","فبراير ","مارس ","أبريل ","مايو ","يونيو ","يوليو ","أغسطس ","سبتمبر ","أكتوبر ","نوفمبر ","ديسمبر "],p=n+" "+o[parseInt(m,10)]+" "+l,q=0;c<h.link.length,q++,i=j.replace(/<.+?>/g,"").substring(0,120)+"...",img=c.media$thumbnail.url.replace("s72-c","s900-c").replace("default","hqdefault"),document.write("<li class='columnl'><div class='maincon'><div class='mainimg'><a class='imag' href="+e+" style='background:url("+img+")no-repeat center center;background-size: cover'></a><span class='forever'></span></div><div class='cont'><span class='tag'><a>"+g+"</a></span><h3 class='titlelab'><a href="+e+">"+f+"</a></h3><div class='autre'><span class='author'><i class='fa fa-user-circle'></i>"+h+"</span><span class='times'><i class='fa fa-clock-o'></i>"+p+"</span><p class='psummary'>"+i+"></p></div></div></li>")}document.write("</ul>")}function related_results_labels_thumbs(e){for(var f=0;f<e.feed.entry.length;f++){var g=e.feed.entry[f];relatedTitles[relatedTitlesNum]=g.title.$t;try{thumburl[relatedTitlesNum]=g.media$thumbnail.url}catch(e){s=g.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),a!=-1&&b!=-1&&c!=-1&&""!=d?thumburl[relatedTitlesNum]=d:"undefined"!=typeof defaultnoimage?thumburl[relatedTitlesNum]=defaultnoimage:thumburl[relatedTitlesNum]="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicPtu-8xq5z6OkQORqGvS36i3ZqYmyFAsbJl4Hbicr4RK8LOoqjSYPsIG4A1eFVn_3C885tWczWlUtRCm9lgNWM3yM4ZmV-X4b9R-L_uL6cpMxGkqY_LS5k1UdQRu04j6fbDq1qw4AVhQ/s400/noimage.png"}relatedTitles[relatedTitlesNum].length>35&&(relatedTitles[relatedTitlesNum]=relatedTitles[relatedTitlesNum].substring(0,90)+"");for(var h=0;h<g.link.length;h++)"alternate"==g.link[h].rel&&(relatedUrls[relatedTitlesNum]=g.link[h].href,relatedTitlesNum++)}}function removeRelatedDuplicates_thumbs(){for(var a=new Array(0),b=new Array(0),c=new Array(0),d=0;d<relatedUrls.length;d++)contains_thumbs(a,relatedUrls[d])||(a.length+=1,a[a.length-1]=relatedUrls[d],b.length+=1,c.length+=1,b[b.length-1]=relatedTitles[d],c[c.length-1]=thumburl[d]);relatedTitles=b,relatedUrls=a,thumburl=c}function contains_thumbs(a,b){for(var c=0;c<a.length;c++)if(a[c]==b)return!0;return!1}function printRelatedLabels_thumbs(a){var b;b="undefined"!=typeof splittercolor?splittercolor:"#d4eaf2";for(var c=0;c<relatedUrls.length;c++)relatedUrls[c]!=a&&relatedTitles[c]||(relatedUrls.splice(c,1),relatedTitles.splice(c,1),thumburl.splice(c,1),c--);var d=Math.floor((relatedTitles.length-1)*Math.random()),c=0;for(relatedTitles.length>0&&document.write('<ul id="related-posts">');c<relatedTitles.length&&c<20&&c<maxresults;)document.write('<li><div class="relaimg"><a'),document.write(' href="'+relatedUrls[d]+'"><img  src="'+thumburl[d]+'"/></a></div><a'),document.write(' href="'+relatedUrls[d]+'"><div class="overlay">'+relatedTitles[d]+"</div></a></li>"),c++,d<relatedTitles.length-1?d++:d=0;document.write("</ul>"),relatedUrls.splice(0,relatedUrls.length),thumburl.splice(0,thumburl.length),relatedTitles.splice(0,relatedTitles.length)}function recentComments(a){var b=a.feed.entry.length>3?3:a.feed.entry.length;comments="<ul class='recentComments recent'>";for(var c=0;c<b;c++){var d="";try{d="<img src='"+a.feed.entry[c].author[0].gd$image.src.replace(/\/s[0-9]+(-*c*)\//,"/s70$1/")+"'/>"}catch(a){d="<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRTg5bgvWVE1ELOtoX9t0l3ySY1YhL-FMHcsbENUnDf7glZ72yqbtzGmIA1Xx0nGkHXv_7eLeqrebxi4n1DBCd4oNVZT6cms0tgDyz6fNp-WgxBHUl0cN9ktpx3vNBaQKXU1XWQNd0nLRZ/s1600-r/th.jpg'/>"}var e=a.feed.entry[c].link[2].href,f=a.feed.entry[c].content.$t.replace(/<.*?>/gi,"").split(/\s+/).slice(0,9).join(" ")+"...",g=a.feed.entry[c].published.$t,h=a.feed.entry[c].author[0].name.$t;g=t(g),comments+="<li><a href='"+e+"'> <div class='commentImg recentImg'>"+d+"</div><div class='commentCon recentCon'><div class='authorName recentTitle'>"+h+"</div><div class='commentSnippet'>"+f+"</div><div class='commentTime recentTime'><span>"+g+"</span></div></div></a></li>"}comments+="</ul>"}function printRecentComments(){document.write(comments)}function t(a){var b=a.substr(0,4),c=months[Number(a.substring(5,7))-1],d=Number(a.substring(8,10)),e=d+" "+c+" "+b;return e}function recentPosts(a){recentPostsV="<ul class='recentPosts recent'>";var b=3;b=a.feed.entry.length>3?3:a.feed.entry.length;for(var c=0;c<b;c++){var d="";try{d="<img src='"+a.feed.entry[c].media$thumbnail.url.replace(/\/s[0-9]+(-*c*)\//,"/s70$1/")+"' />"}catch(a){d="<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRTg5bgvWVE1ELOtoX9t0l3ySY1YhL-FMHcsbENUnDf7glZ72yqbtzGmIA1Xx0nGkHXv_7eLeqrebxi4n1DBCd4oNVZT6cms0tgDyz6fNp-WgxBHUl0cN9ktpx3vNBaQKXU1XWQNd0nLRZ/s1600-r/th.jpg'/>"}var e=t(a.feed.entry[c].published.$t),f=a.feed.entry[c].title.$t,g=a.feed.entry[c].link[a.feed.entry[c].link.length-1].href;recentPostsV+="<li><div class='recentPostImg recentImg'>"+d+"</div><div class='recentCon'><div class='recentPostTitle recentTitle truncate'><a href='"+g+"'>"+f+"</a></div><div class='recentPostTime recentTime'><span>"+e+"</span></div></div></li>"}recentPostsV+="</ul>"}function printRecentPosts(){document.write(recentPostsV)}$(document).ready(function(){$(".widget-content").each(function(){var a=$(this).text();a.match("random-posts")&&$.ajax({url:"/feeds/posts/default?alt=json-in-script",type:"get",dataType:"jsonp",success:function(a){var b=a.feed.entry.length,c=0,e=b-5,g=Math.floor(Math.random()*(e-c+1))+c;$.ajax({url:"/feeds/posts/default?alt=json-in-script&start-index="+g+"&max-results=4",type:"get",dataType:"jsonp",success:function(a){for(var b="",c='<ul class="post-widget">',e=0;e<a.feed.entry.length;e++){for(var g=0;g<a.feed.entry[e].link.length;g++)if("alternate"==a.feed.entry[e].link[g].rel){b=a.feed.entry[e].link[g].href;break}var h=a.feed.entry[e].title.$t,i=a.feed.entry[e].author[0].name.$t,j=a.feed.entry[0].published.$t,k=j.substring(0,4),g=j.substring(5,7),m=j.substring(8,10),n=[,"يناير ","فبراير ","مارس ","أبريل ","مايو ","يونيو ","يوليو ","أغسطس ","سبتمبر ","أكتوبر ","نوفمبر ","ديسمبر "],o=m+" "+n[parseInt(g,10)]+" "+k,p=0;if(b<i.link.length,p++,l=a.feed.entry[e].category[0].term,d=$("<div>").html(l),f=d.find("img:first").attr("src"),m=a.feed.entry[e].media$thumbnail.url,void 0===f)var k='<div class="randomimg"><a class="rcp-thumb" href="'+b+'" style="background:url('+m+') no-repeat center center;background-size: cover"><span class="featured-overlay"></span></a></div>';else var k='<a class="rcp-thumb" href="'+f+'"><img src="'+f+'"/></a>';c+="<li class='columns'>"+k+'<div class="re-tag"><span class="tag">'+l+'</span></div><div class="post-panel"><h3 class="rcp-title"><a href="'+b+'">'+h+'</a></h3><div class="re-ps"><span class="recent-date"><i class="fa fa-clock-o"></i>'+o+"</span></div></div></li>"}c+='</ul><div class="clear"/>',$(".widget-content").each(function(){$(this).text().match("random-posts")&&($(this).html(c),$(this).find("a.rcp-thumb").each(function(){$(this).attr("style",function(a,b){return b.replace("/default.jpg","/mqdefault.jpg")}).attr("style",function(a,b){return b.replace("s72-c","s1000")})}))})}})}})})});var relatedTitles=new Array,relatedTitlesNum=0,relatedUrls=new Array,thumburl=new Array;$(document).ready(function(){$("#related-posts img").attr("src",function(a,b){return b.replace("s72","s640")}),$("#related-posts img").attr("src",function(a,b){return b.replace("/default.jpg","/mqdefault.jpg")})});var months=["يناير","فبراير","مارس","أبريل","مايو","يونيو"," يوليو"," أغسطس","سبتمبر","أكتوبر","نوفمبر"," ديسمبر"];
//]]>
</script>

المرحلة الاخيرة هي كود اضهار السلايد شو و يكون عادة تحت القائمة العلوية و قبل المواضيع

لذا يمكنك تجربة وضع قبل وسم main-wrapper او post-wrapper و شوف النتيجة
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div class='randompost'>
<div class='section' id='rpost'>
<div class='widget-content'>
random-posts
</div>
</div>
</div>
</b:if>
</b:if>
الاَن احفظ القالب و شاهد النتيجة .

ملاحظات :

اذا كان قالب الذي حملته يحوي على سلايد شو و هو متوقف و لا يظهر مثلا بسبب ازالة حقوق المصمم فهنا يجب عليك ازالة كافة سكربتات  السلايد القديم و css الخاص به و عادة ابحث في القالب عن وسم Carousel او owlcarousel و قم بجذف كامل السكربت الشبيه بالذي اضفناه في الاعلى و نفس الشيء بالنسبة ل css الذي وضعناه قبل b:skin قم بجذفها و استبدالها .
تأكد  ايضا من وجود كلمة random في صندوق inrto-sec من التخطيط

الثلاثاء، 10 أكتوبر 2017

اضافة الاشتراك باليوتيوب لمدونات البلوجر بشكل احترافي جدا 2017

اضافة الاشتراك باليوتيوب لمدونات البلوجر بشكل احترافي جدا 2017


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

طريقة التركيب

  1. لوحة التحكم
  2. التخطيط
  3. إضافة أداة-HTML/JavaScript
  4. اضف الكود التالي
  5. غير مايلزم

<style>.youtube{    background: url(http://cdn.top4top.co/i_98ffddc0241.png);    padding: 14px 0px 20px;    border-radius: 5px;    text-align: center;}.youtube:hover{    box-shadow: 0px 0px 200px -5px #DEDEDE inset;}.youtube a{    background: #f00;    color: #FFF;    border-radius: 3px;    font-size: 16px;    padding: 3px 10px 4px;    font-family: tahoma;    border: 1px solid #961212;}.youtube a:hover{    border: 1px solid #656565;    box-shadow: 0px 0px 15px -1px #FFFFFF;    background: #F1F1F1;    color: #585858;}.youtube h3{    color: #2C2C2C;    font-weight: normal;    font-size: 22px;    text-align: center;    margin-bottom: 9px;    text-shadow: 0px 0px 10px #FFF;}</style><div class="youtube"><h3> الاشتراك باليوتيوب</h3><a href="https://www.youtube.com/channel/UCugG1qa1O9kim4fS-kvKM9w" target="_blank">subscribe</a></div>

الأربعاء، 27 سبتمبر 2017

حصريا اضافة صندوق اعجاب للفيسبوك بشكل مصغر اسفل المدونة بطريقة رهيبة

حصريا اضافة صندوق اعجاب للفيسبوك بشكل مصغر اسفل المدونة بطريقة رهيبة


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

اولا اختار  المظهر بعدين تحرير القالب اعمل ctrl+v ابحث عن </style>


ستظهر لك اكثر من واحد اختر الثانية بعد ذالك ضع هذا الكود قبل كلمة </style>


 
-
 ثم قم بالبحث عن </body>


بعد ذالك قم بلصق الكود التالي فوق الوسم


-
قم بتغيير كلمة 9sifan9  باخر كلمة في رابط الفيس بوك
مثلا هذا رابط صفحتي في الفيس بوك
https://www.facebook.com/9sifan9    قم بنسخ اخر كلمة لديك والصقها مكان 9sifan9

هذا الموضوع بمجهود شخصي وغير منقول يرجاء مشاركة الموضوع للاستفادة معا ذكر المصدر 

الثلاثاء، 11 يوليو 2017

من اضخم تطبيقات 2017 يحتوي على اكبر موسوعة من المواقع التقنية في العالم

من اضخم تطبيقات 2017 يحتوي على اكبر موسوعة من المواقع التقنية في العالم

عرب تكنولوجي متعة التكنولوجيا

التطبيق الجديد كلياً


-يحتوي على اكبر مجموعة من المصادر التقنية في العالم
 
-إشعارات بالأخبار الجديدة


-اطلاع دائم بكل جديد عالم التكنولوجيا
 
-تصميم جميل وجذاب ب-لغة ميترال ديزاين


-خفيف وسهل التصفح داخل البرنامج
 
-إمكانية قراءة الأخبار دون وجود اتصال بالانترنت
 
-إمكانية مشاركة الخبر عبر تطبيقات التواصل الاجتماعي
 
-التغيير بين الثيمات الغامق اليلي الخفيف والافتراضي
 
-شاهد آخر تحديثات قنوات اليوتيوب التقنية

-إمكانية تغيير حجم الخط للراحة أثناء القراءة

-قائمة الأخبار المفضلة لديك اللتي يتم وضع علامة نجمة عليها للرجوع لها متى ما شئت

-قائمة بالأخبار الغير مقرونة

-قائمة بأخبار آخر 24 ساعة

-إمكانية البحث السريع للوصول لما تريدة بشكل أسرع 
 
-يدعم جميع لغات العالم وأهمها اللغة العربية

-يدعم الترجمة الى أي لغة في العالم
 
تستطيع تحميل التطبيق من الرابط التالي مجاناً


الخميس، 23 مارس 2017

أضافة تبادل اعلاني احترافي وبتقنية Jquery

أضافة تبادل اعلاني احترافي وبتقنية Jquery




السلام عليكم ورحمه الله وبركاته اللهم صلى على سيدنا محمد وعلى ال محمد

اهلا بكم متابعي مدونة حمزه ويب وزوارة الكرام في هذه تدوينة جديدة وحصرية
على مدونة حمزه ويب 

راح نقدم لكم اضافة احترافية وغير موجوده على ويب ولأول مرة 
يقدمة حمزه ويب وهو اضافة تبادل اعلاني عرب ويب 
اضافة احترافية وبتقنية Jquery و css 
 اضافة مكودة من قبل حمزه ويب 





معاينة اضافة .




صورة اضافة






 شرح تركيب اضافة


  1. لوحة تحكم
  2. تخطيط
  3. اضافة اداه
  4. Html/Javascript
  5. واضف هذا كود
  6. واحفظة


<div class="widget-content"><style> .ar1web125x125 {margin-right: -7px; text-align:center;}.ar1web125x125 img {width:125px; height:125px;margin: 3px 8px 0 0;}img.ar1web-125x125 {border: 1px solid #eee;padding: 5px;background: #FCFBFB;transition: all .7s ease-out 0s;}img.ar1web-125x125:hover{background:#E74C3C;border: 1px solid #ddd;}img#ihussamar1web:hover{background:#3498db;border: 1px solid #ddd;}img#ihussam-ar1web:hover{background:#9b59b6;border: 1px solid #ddd;}img#hussam-ar1web:hover{background:#1abc9c;border: 1px solid #ddd;}</style> <div class="ar1web125x125" style="text-align:center;"><a href="http://www.ha1web.blogspot.com/" target="_blank"><img class="ar1web-125x125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy6iUJ5XEoxs3JFrTBKrXOd-6TjW_5-PK1tO7Cb_ZLlvDuGh5k0-1B1b4DLFnewQHllERl0wdrBkgagn8CwbYHjYw6ht8eHPjFs512hu0S2EJSQvHPqF48KO-2B0VDn6QdZUb-DYsqSS7T/s320/bleu.png" title="اعلن هنا" /></a>
<a href="http://www.ha1web.blogspot.com/" target="_blank"><img id="hussam-ar1web" class="ar1web-125x125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAWp6uDo5x47YUES-QS5Z7IQx2GZb6Fr8mNs8VcOMWKRfpt6P3CBpzY3S9Ckf0nMio_czolqfi3Vr7a4PRZLCcdsp9ZVMNJPqI62QKle5rtJfTpObhscHVC1oc3ZD_3kBk93QcuCwHdJsq/s320/red.png" title="اعلن هنا" /></a>
<a href="http://www.ha1web.blogspot.com/" target="_blank"><img id="ihussam-ar1web" class="ar1web-125x125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy6iUJ5XEoxs3JFrTBKrXOd-6TjW_5-PK1tO7Cb_ZLlvDuGh5k0-1B1b4DLFnewQHllERl0wdrBkgagn8CwbYHjYw6ht8eHPjFs512hu0S2EJSQvHPqF48KO-2B0VDn6QdZUb-DYsqSS7T/s320/bleu.png" title="اعلن هنا" /></a>
<a href="http://www.ha1web.blogspot.com/" target="_blank"><img id="ihussamar1web" class="ar1web-125x125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy6iUJ5XEoxs3JFrTBKrXOd-6TjW_5-PK1tO7Cb_ZLlvDuGh5k0-1B1b4DLFnewQHllERl0wdrBkgagn8CwbYHjYw6ht8eHPjFs512hu0S2EJSQvHPqF48KO-2B0VDn6QdZUb-DYsqSS7T/s320/bleu.png" title="اعلن هنا" /></a></div></div>

وغيير اعلن هنا بأسم موقع 
وغيير رابط مدونتي برابط الذي يناسبك

تغيير شكل مشاركات الى شكلين احترافيين وجميلان

تغيير شكل مشاركات الى شكلين احترافيين وجميلان


السلام عليكم ورحمه الله وبركاتة اللهم صلى على سيدنا محمد وعلى ال محمد 

اهلا بكم متابعي مدونة حمزه ويب وزوارة الكرام في هذه تدوينة جديدة وحصرية على
مدونة حمزه ويب 

راح نقدم لكم كيفية تغيير شكل مشاركات مدونة الى شكلين احترافيين
وجيلان من حمزه ويب 



طريقة تركيب .

  1. لوحة تحكم 
  2. قالب 
  3. تحرير HTML 
  4. ابحث عن هذا كود ]]></b:skin>
  5. واضف كود مشاركة الذي تعجبك فوقة


كود مشاركة اولى

/* CSS Popular Post */.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img {margin:0;padding:0;list-style:none;border:none;background:none;outline:none;}.PopularPosts ul li img {display:none;margin:2px;margin-left:10px;padding:0;width:60px;height:60px;float:right;}.PopularPosts ul li {background-color:#fff;margin:0;padding:0;position:relative;box-shadow:inset 4px 0 0 rgba(255,255,255,0.0);transition:all 0.1s ease-out;}.PopularPosts ul li:hover {background:#cf8860;box-shadow:inset 4px 0 0 rgba(250, 250, 250, 1);}.PopularPosts ul li:last-child {border-bottom:none;}.PopularPosts ul li .item-title a, .PopularPosts ul li a {font-weight:400;color:#fff;text-decoration:none;transition:all 0.1s ease-in-out;}.PopularPosts ul li a:hover {color:#fff!important;}.PopularPosts ul li:before {display:none;list-style:none;}.PopularPosts .item-thumbnail {display:none;float:left;margin:0 0 0 0;}.PopularPosts .item-snippet {display:none;font-size:10px;color:#fff;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.PopularPosts .item-title {padding-bottom:.2em;margin:3px 10px;}.profile-img{display:inline;opacity:1;margin:0 0 3px 6px;}.PopularPosts .widget-content ul li {padding:.5em 0 .5em 0;}.PopularPosts ul li:nth-child(even) {background:#E74C3C}.PopularPosts ul li:nth-child(odd) {background:#E74C3C}.PopularPosts ul li:hover:nth-child(even),.PopularPosts ul li:hover:nth-child(odd){background:#DA4A3B}


كود مشاركة ثانية

/* CSS Popular Posts */      .PopularPosts .widget-content ul{list-style-type:none;overflow:hidden;}      #PopularPosts1 ul li .item-thumbnail{overflow:hidden;float :left;margin-right:10px;}      #PopularPosts1 img {overflow:hidden;width : 72px;height:72px;-ms-transform: scale(1.0);-webkit-transform: scale(1.0);-moz-transform: scale(1.0);transform: scale(1.0);transition:all .4s linear;-moz-transition:all .4s linear;-webkit-transition:all .4s linear;}      #PopularPosts1 img:hover{-ms-transform: scale(1.2);-webkit-transform: scale(1.2);-moz-transform: scale(1.2);transform: scale(1.2);transition:all .4s linear;-moz-transition:all .4s linear;-webkit-transition:all .4s linear;}      .PopularPosts .widget-content ul li{position :relative;padding:0;margin:10px auto;}      .PopularPosts .widget-content ul li:first-child {margin-top:0;}      .PopularPosts .widget-content ul li:last-child {margin-bottom:0;}      .PopularPosts .widget-content ul li:nth-child(1){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(202,220,85,0.8);width : 100%;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li:nth-child(2){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(243,93,92,0.8);width : 100%;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li:nth-child(3){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(10,151,181,0.8);width : 100%;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li:nth-child(4){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(15,203,205,0.8);width : 100%;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li:nth-child(5){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(16,170,206,0.8);width : 100%;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li:nth-child(6){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(202,220,85,0.8);width : 100%;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li:nth-child(7){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(243,93,92,0.8);width : 100%;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li:nth-child(8){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(10,151,181,0.8);width : 100%;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li:nth-child(9){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(15,203,205,0.8);width : 100%;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li:nth-child(10){background:#f3f5f7;border:1px solid #e7e8ea;border-right:2px solid rgba(16,170,206,0.8);width : 100%;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li a{color:#525f6a;transition:all 0.3s ease-out;}      .PopularPosts .widget-content ul li a:hover{color:#e1b364;}      .PopularPosts .widget-content ul li:hover:nth-child(1),.PopularPosts .widget-content ul li:hover:nth-child(2),.PopularPosts .widget-content ul li:hover:nth-child(3),.PopularPosts .widget-content ul li:hover:nth-child(4),.PopularPosts .widget-content ul li:hover:nth-child(5),.PopularPosts .widget-content ul li:hover:nth-child(6),.PopularPosts .widget-content ul li:hover:nth-child(7),.PopularPosts .widget-content ul li:hover:nth-child(8),.PopularPosts .widget-content ul li:hover:nth-child(9),.PopularPosts .widget-content ul li:hover:nth-child(10){background:#fff;}      .PopularPosts .widget-content{background:#fff;}      .PopularPosts .item-thumbnail{float :right;padding:0;margin:0;}      .PopularPosts .item-title {color:#b2b5be;font-weight:400;font-size:12px;padding:5px;}      .PopularPosts .item-snippet {display :none;font-size:12px;color:#b2b5be;overflow:hidden;text-align:justify;}      .sidebar .label-size {position :relative;text-transform:none;text-decoration:none;font-size:12px;font-family:&#39;ge_ss_threeregular&#39;;}      .sidebar .label-size a {color:#525f6a;font-weight:400;padding:10px 12px;        margin:0 0 2px 2px;float :right;display :block;border:4px solid #eceef0;transition: all 0.4s ease-in-out;}      .sidebar .label-size-1 a {box-shadow:inset 2px 0 0 0 #1abc9c;opacity:0.8;}      .sidebar .label-size-1 a:hover {box-shadow:inset 100px 0 0 0 #1abc9c;color:#fff!important;opacity:1;}      .sidebar .label-size-2 a {box-shadow:inset 2px 0 0 0 #3498db;opacity:0.8;}      .sidebar .label-size-2 a:hover {box-shadow:inset 100px 0 0 0 #2980b9;color:#fff!important;opacity:1;}      .sidebar .label-size-3 a {box-shadow:inset 2px 0 0 0 #2ecc71;opacity:0.8;}      .sidebar .label-size-3 a:hover {box-shadow:inset 100px 0 0 0 #27ae60;color:#fff!important;opacity:1;}      .sidebar .label-size-4 a {box-shadow:inset 2px 0 0 0 #9b59b6;opacity:0.8;}      .sidebar .label-size-4 a:hover {box-shadow:inset 100px 0 0 0 #8e44ad;color:#fff!important;opacity:1;}      .sidebar .label-size-5 a {box-shadow:inset 2px 0 0 0 #e74c3c;opacity:0.8;}      .sidebar .label-size-5 a:hover {box-shadow:inset 100px 0 0 0 #c0392b;color:#fff!important;opacity:1;}      .sidebar .label-size:hover{background:none;}      .label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5 {        font-size:100%;}      .cloud-label-widget-content{text-align:right}      .label-size{display :block;float :right;margin:0 0 2px 2px;color:#fff;transition:all 0.4s ease-in-out;}

واضغط حفظ نموذج واذهب الى 
تخطيط واختار اضافة اداة 
واختر مشاركات


وانتهى موضوعنا