قالب ميترو الإحترافي لمدونات بلوجر 2015

قالب ميترو الإحترافي لمدونات بلوجر 2015

محمد الكناني    تعليق   

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

تحميل القالب

طريقة اضافة سلايد شو مدونة المحترف الجديد الى مدونات بلوجر

طريقة اضافة سلايد شو مدونة المحترف الجديد الى مدونات بلوجر

محمد الكناني    تعليق   

طريقة اضافة السلايد شو الى مدونات البلوجر

• نتوجه الى المدونة 
• ثم قالب ،
• تحرير HTML
• نبحث عن الكود الثالي 

</head>

• ثم نضيف الكود الثالي فوقه   " قبل الوسم </head> "

<script>
//<![CDATA[
/* Script from:http://hukmat.blogspot.com/ */
imgr = new Array();
imgr[0] = "http://lh3.ggpht.com/_kViOplhgIHI/TKxBIScZTiI/AAAAAAAAAWE/PM7AQ1lf6ME/noimages.jpg";
showRandomImg = true;
aBold = true;
summaryPost = 150;

numposts1 = 6;
label1 = "المفكر";
function removeHtmlTag(strx,chop){var s=strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length)}}s=s.join("");s=s.substring(0,chop-1);return s}
function showrecentposts1(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts1;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split("")[0];break}}
       
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
postdate = entry.published.$t;
if(j>imgr.length-1) j=0;
img[i] = imgr[j];
s = postcontent    ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);
if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d;
var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break;
}}
var daystr = day+ ' ' + m + ' ' + y ;
var trtd = '<div class="contentdiv"><div class="alwansf"><a href="'+posturl+'"><img width="617" height="385" class="alignnone" src="'+img[i]+'"/></a><div class="sliderPostInfo"></div></div><div class="alwanip"><h6><a href="'+posturl+'">'+posttitle+'</a></h6><div class="alwand" >'+daystr+'</div><p>'+removeHtmlTag(postcontent,summaryPost)+'...</p></div></div>';    
document.write(trtd);      
j++;
}}
//]]>
</script>

• نبحث مرة أخرى عن الوسم 

</body>

• ثم نضيف الكود التالي فوقه  " قبل الوسم </body> "

<script type="text/javascript" src="http://yourjavascript.com/917824114/slider.js"></script><script>
      featuredcontentslider.init({
        id: &quot;slider1&quot;, //id of main slider DIV
        contentsource: [&quot;inline&quot;, &quot;&quot;], //Valid values: [&quot;inline&quot;, &quot;&quot;] or [&quot;ajax&quot;, &quot;path_to_file&quot;]
        toc: &quot;#increment&quot;, //Valid values: &quot;#increment&quot;, &quot;markup&quot;, [&quot;label1&quot;, &quot;label2&quot;, etc]
        nextprev: [&quot;Previous&quot;, &quot;Next&quot;], //labels for &quot;prev&quot; and &quot;next&quot; links. Set to &quot;&quot; to hide.
        enablefade: [true, 0.5], //[true/false, fadedegree]
        autorotate: [true, 6000], //[true/false, pausetime]
        onChange: function(previndex, curindex){ //event handler fired whenever script changes slide
        //previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
        //curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
      }
                                 })
    </script>

• نبحث عن الكود 

 ]]></b:skin>

• ثم نضيف الكود التالي قبله  - فوقه

 /*--------------Slider-------------*/
#alwansd{
height: 276px;
margin: 0 auto;
padding: 18px;
background: #fbfbfb;
width: 1229px;
margin-right: -132px;
border-bottom: 2px solid #E6E6E6;
position: relative;
}
.alwanw{
position: relative;
height: 241px;
width: 78%;
margin: 0 auto;
}
.alwanw .contentdiv{
visibility: hidden;
opacity: 1;
position: absolute;
height: 240px;
}
.alwan-ps{
text-align: right;
float: left;
width: 490px;
height: 13px;
margin: 0 auto;
}
.alwan-ps .toc {
float: right;
font-size: 0;
width: 13px;
height: 13px;
background: #e74c3c;
margin-left: 8px;
border-radius: 60px;
}
.alwan-ps .selected {background: #95A5A6;}
.alwan-ps .prev ,.alwan-ps .next{
display:none;
}
.alwan-ps .next:hover{background:url(http://3.bp.blogspot.com/-F8fngEbMepA/UVydrTCbj4I/AAAAAAAAD7Q/scYhb8FHD5U/s1600/next-h.png);}
.alwanip{
width: 486px;
float: left !important;
padding: 0 37px 0 0;
margin: 0 auto;
}
.alwanip a{
color: #2c3e50;
font: 19px DroidKufi-Bold;
margin: 0 auto;
line-height: 37px;
}
.post-body img {
margin: -1px 0 0 8px;
padding: 3px;
border: 1px solid #dfdfdf;
border-radius: 3px;
}
.alwanip h6{margin: 0;}
.alwanip h6 a:hover {color:#95A5A6;}
.alwanip .alwand{
color:#fff;
}
.alwanip p{
margin: 0 auto;
color: #95A5A6;
font-family: hacen_liner;
}
.alwansf {
float: right !important;
margin:0 auto;
}
.alwansf a img {
width: 435px;
height: 275px;}
.alwansf a img:hover{
}
.alwansf a img:hover {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
-webkit-transition: -webkit-transform 0.4s;
-moz-transition: -moz-transform 0.4s;
transition: transform 0.4s;
}

•   أخير مرحلة  نبحث عن 

<div id='content-wrapper'> 

أو الكود الثالي  

 <div id='main-wrapper'>

• ثم نضيف الكود الثالي تحته مباشرة  أسفل الكود السابق

<div id='alwansd'>
<div class='alwanw' id='slider1'>
<script>//<![CDATA[
document.write("<script src=\"/feeds/posts/default/-/"+label1+"?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
//]]>
</script>
</div>
<div class='alwan-ps' id='paginate-slider1'>
</div>
</div>

  </b:if>

• ثم نضغط على حفظ .
• لا تنسوا تغيير المفكر بإسم تسميتك أو قسمك المفضلة .

تحميل الكود ومرفقاته

تحميل قالب مدونة المحترف الجديد 2015

تحميل قالب مدونة المحترف الجديد 2015

محمد الكناني    1 تعليق   

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

رابط تحميل         أو          رابط آخر

إضافة أزرار المشاركة في المواقع الإجتماعية بشكل احترافي لبلوجر

إضافة أزرار المشاركة في المواقع الإجتماعية بشكل احترافي لبلوجر

محمد الكناني    تعليق   

طريقة اضافتها الى مدونات البلوجر

• نتوجه الى المدونة ،  قالب ،
• تحرير HTML  ،  ثم نبحث عن </head>
• نضيف الكود التالي فوقه مباشرة .

<style type='text/css'>
#demo1.sharrre {
width: 100%;
display: inline-block;
}
.sharrre .box {
float: left;
}
.sharrre .count {
color: #444444;
display: block;
font-size: 17px;
line-height: 34px;
height: 34px;
padding: 4px 0;
position: relative;
text-align: center;
text-decoration: none;
width: 50px;
background-color: #eee;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.sharrre .share {
color: #FFFFFF;
display: block;
font-size: 11px;
height: 16px;
line-height: 16px;
margin-top: 3px;
padding: 0;
text-align: center;
text-decoration: none;
width: 50px;
background-color: #9CCE39;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.sharrre .buttons {
display: none;
float: left;
width: 300px;
}
.sharrre .button {
float: left;
max-width: 50px;
height: 50px;
margin-left: 10px;
}
</style>
<script src='http://code.jquery.com/jquery-1.10.1.min.js'/>
<script src='http://yourjavascript.com/27299101294/jquery-sharrre-min.js' type='text/javascript'/>
<script src='http://yourjavascript.com/22512901748/jquery-sharrre.js' type='text/javascript'/>

• نبحث الآن عن الكود  </body>
• نضيف الكود التالي فوقه مباشرة .

<script>
$(function(){
$(&#39;#demo1&#39;).sharrre({
share: {
googlePlus: true,
facebook: true,
<a href='http://www.jqueryscript.net/tags.php?/twitter/'>twitter</a>: true,
delicious: true
},
buttons: {
googlePlus: {size: &#39;tall&#39;},
facebook: {layout: &#39;box_count&#39;},
twitter: {count: &#39;vertical&#39;},
delicious: {size: &#39;tall&#39;}
},
hover: function(api, options){
$(api.element).find(&#39;.buttons&#39;).show();
},
hide: function(api, options){
$(api.element).find(&#39;.buttons&#39;).hide();
}
});
});
</script>

ها قد انتهينا من المرحلة الأولى ، الأن نختار اللإضافة التي نريدها و نضيف الكود الخاص بها الى المدونة .

• الشكل  1 

الحصول على الكود

• الشكل 2

الحصول على الكود

• الشكل 3

الحصول على الكود

• الشكل 4

الحصول على الكود

• و أخيرا نضغط على حفظ .

المصدر

أداة البحث لمدونات بلوجر بشكل احترافي وتلقائية البحث

أداة البحث لمدونات بلوجر بشكل احترافي وتلقائية البحث

محمد الكناني    تعليق   

طريقة تركيب الإضافة على البلوجر

1. نتوجه الى مدونة ، قالب  ، تحرير HTML

2. نبحث عن الكود 

</head>

3. نضيف الكود التالي فوقه مباشرة 

<style>
/*-------ajax-form---------*/
/* By http://hukmat.blogspot.com  */
#ajax-search-form {
float: left;
}
#ajax-search-form a {
color:#741F27;
text-decoration:none;
}
#ajax-search-form .searchbox {
padding: 6px 10px 6px;
background: #f8f8f8;
margin: 2px 0 0 -5px;
font: normal 12px ges;
border: 1px solid #000;
}
#ajax-search-form .searchbtn {
background: #e74c3c ;
padding: 6px 10px;
border: 1px solid #000;
font: normal 12px GES;
color: #fff;
cursor: pointer;
}
#search-result {
border-top: none;
background-color: #FFF;
padding: 10px;
margin: 10px 0;
width: 200px;
height: auto;
position: relative;
top: 0;
left: 0;
max-height:310px;
overflow:auto;
z-index: 99;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
display: none;
}
#search-result li {
padding: 10px;
border: 1px dotted #EEE;
color: #AAA;
font-size: 0px;
line-height: 1em;
margin: 0 0 5px 5px;
overflow: hidden;
}
#search-result img {
float: right;
margin: 0 0 0 8px;
border: 3px solid #EEE;
}
#ajax-search-form a {
color: #888;
line-height: 1.3em !important;
font: normal 12px tahoma;
text-decoration: none;
padding: 0;
}
#search-result ol,
#search-result h4 {
margin:0;
padding:0;
}
#search-result h4, #search-result strong {
display: block;
margin: 0 0 10px 0;
font: normal 12px ges,tahoma;
color: #BF4247;
}
#search-result ol {margin:0}
#search-result ol a:hover {
color: #BF4247;
text-decoration: underline;
background: none;
}
#search-result .close {
display: block;
position: absolute;
top: 0;
left: 10px;
line-height: normal;
color: #f00;
font-size: 18px;
}
#search-result strong {color:#B75252}
    </style>

4. نبحث عن الكود 

</body>

5. نضيف الكود التالي فوقه  ثم نضغط على حفظ .

<script type='text/javascript'>
   //<![CDATA[
(function($) {
    var $form = $('#ajax-search-form'),
        $input = $form.find(':text');
 
    // Append a search result container to the search form
    $form.append('<div id="search-result"></div>');
    var $result_container = $('#search-result');
 
    // When the keyword is submitted...
    $form.on("submit", function() {
        // Get the input value
        var keyword = $input.val();
        // Show the search result container and insert a `Loading...` text
        $result_container.show().html('جاري عملية البحث...');
        // Get the blog JSON via $.ajax() to show the search result
        // The URL format: http://blog_name.blogspot.com/feeds/posts/summary?alt=json-in-script&q={THE_KEYWORD}&max-results=9999
        $.ajax({
            url: 'http://www.hukmat.blogspot.com/feeds/posts/summary?alt=json-in-script&q=' + keyword + '&max-results=9999',
            type: 'get',
            dataType: 'jsonp',
            // If success, grab the search result list...
            success: function(json) {
                var entry = json.feed.entry,
                    link, summary, thumbnail, skeleton = "";
                if (entry !== undefined) {
                    skeleton = '<h4> نتائج البحث عن   &#8220;' + keyword + '&#8221;</h4>';
                    skeleton += '<a class="close" href="/">&times;</a><ol>';
                    for (var i = 0; i < entry.length; i++) {
                        for (var j = 0; j < entry[i].link.length; j++) {
                            if (entry[i].link[j].rel == "alternate") {
                                link = entry[i].link[j].href;
                            }
                        }
                        thumbnail = ("media$thumbnail" in entry[i]) ? '<img alt="" src="' + entry[i].media$thumbnail.url.replace(/\/s[0-9]+\-c/, "/s40-c") + '" width="40" height="40">' : "";
                        summary = ("summary" in entry[i]) ? entry[i].summary.$t.replace(/<br ?\/?>/ig, " ").replace(/<.*?>/g, "").replace(/[<>]/g, "") : "";
                        summary = summary.length > 100 ? summary.substring(0, 100) + '&hellip;' : summary;
                        skeleton += '<li>' + thumbnail + '<a href="' + link + '">' + entry[i].title.$t + '</a><br>' + summary + '</li>';
                    }
                    skeleton += '</ol>';
                    $result_container.html(skeleton);
                } else {
                    // If the JSON is empty ... (entry === undefined)
                    // Show the `not found` or `no result` message
                    $result_container.html('<a class="close" href="/">&times;</a><strong> يتعذر الوصول للمطلوب :(</strong>');                }
            },
            error: function() {
                // If error, show an error message
                $result_container.html('<a class="close" href="/">&times;</a><strong>خطأ في عملية البحث!!!</strong>');
            }
        });
        return false;
    });
    // Fade out the search result container if the close button is clicked
    $form.on("click", ".close", function() {
        $result_container.fadeOut();
        return false;
    });
})(jQuery);
 //]]>
</script>

6.  نتوجه الى التخطيط ، اضافة اداة ، JavaScript/HTML

7.  ثم نضيف الكود الخاص بالاضافة البحث 

<form action='/search' id='ajax-search-form'>
<input class='searchbox' name='q' placeholder='ابحث في ثنايا الموقع' type='text'/>
<input class='searchbtn' type='submit' value='بحث'/>
</form>

8. تم

المصدر

طريقة اضافة تأثير على صور في بلوجر

طريقة اضافة تأثير على صور في بلوجر

محمد الكناني    تعليق   

شرح طريقة الإضافة

1. نتوجه الى المدونة .

2. قالب 

3. تحرير HTML

4. نبحث عن الكود 

</head>

5. نضيف الكود الثالي فوقه مباشرة 

  <style>
<!--- hukmat.blogspot.com --->
.post-body img {
  /* Firefox 10+, Firefox on Android */
  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  /* IE 6-9 */
  filter: gray;
  /*
    Chrome 19+,
    Safari 6+,
    Safari 6+ iOS,
    Opera 15+
  */
  -webkit-filter: grayscale(100%);
}
.post-body img {
  -webkit-transition: -webkit-filter .5s;
}
.post-body img:hover {
  -webkit-filter: grayscale(0%);
  filter: none;
}
.post-body img svg {
  opacity: 1;
  -webkit-transition: opacity .5s ease;
  transition: opacity .5s ease;
}
.post-body img:hover svg {
  opacity: 0;
}
  </style>

6. ثم أخيرا نضغط على حفظ .

طريقة عرض اعلان ادسنس وسط المواضيع في البلوجر

طريقة عرض اعلان ادسنس وسط المواضيع في البلوجر

محمد الكناني    تعليق   

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

أيضا هذه الطريقة غير مخالفة لسياسة الأدسنس ، فلا خوف على مدونتك .

سترى الفرق بعد استعمال هذه الطريقة من حيث الدخل اليومي من الاعلانات  مما يعني زيادة النقر عليها .

طريقة اضافة الإضافة :

1. نتوجه الى المدونة 

2. قالب

3. تحرير HTML

4. نبحث عن الكود الثالي 

<data:post.body/>

ستجد أكثر من كود  الكود الثاني هو المطلوب

5. استبدله بالكود التالي 

<div id='jobmiddlenew'>

 <data:post.body/>
          </div>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#addcodemiddle{display: none;}
</style>
<div id='addcodemiddle'>

ضع الإعلان هنا
    </div>
 <script type='text/javascript'>

var str1=document.getElementById(&quot;jobmiddlenew&quot;).innerHTML;
var str2=str1.length;
var str3=str2/2;
var substr = str1.substring(str3, str2);
var n = substr.search(&quot;&lt;br&gt;&quot;);
if(n&lt;0)
{
n = substr.indexOf(&#39;.&#39;);
if(n&lt;0)
{
n=0;
}
var firsthalf = str1.substring(0, str3+n+1);
var secondhalf = str1.substring(str3+n+1, str2);
}
else
{
var firsthalf = str1.substring(0, str3+n+4);
var secondhalf = str1.substring(str3+n+4, str2);
}
var addcode=&quot;<center>&quot;+document.getElementById(&quot;addcodemiddle&quot;).innerHTML+&quot;</center><br/>&quot;;
var newbody=firsthalf+addcode+secondhalf;

var strnew=document.getElementsByClassName(&quot;post-body entry-content&quot;);
strnew[0].innerHTML=newbody;
document.getElementById(&quot;addcodemiddle&quot;).innerHTML=&quot;&quot;;
   
</script>
  </b:if>

6. لا تنسى وضع الإعلان مكانه الخاص .

7. نضغط حفظ .

ملاحظة : لابد من تحويل الإعلان قبل اضافته الى HTML.

قالب مدونة حوحو للمعلومات

قالب مدونة حوحو للمعلومات

محمد الكناني    تعليق   

من ابسط القوالب على الاطلاق واروعها في مجال التقنية، مبسط وبسلايدر احترافي خفيف و يعتبر قالب مدونة حوحو من أشهر القوالب الذي اطلقته الوان بلوجر .

للتشغيل السلايدر شو ابحث عن كلمة "مواضيع" و غيرها بأحد اقسام موقعك 

للتغير الشعار ابحث عن العنوان التالي : 

http://3.bp.blogspot.com/-bQLhat1Sl2c/UIQxKB9dsQI/AAAAAAAABzM/TgTqijw8AXI/s1600/small-logo.png

التحميل

قالب فوتوشوب لمدونات بلوجر

قالب فوتوشوب لمدونات بلوجر

محمد الكناني    تعليق   

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

كود HTML:

http://im83.gulfup.com/bnRXf.png

تحميل

معاينة

قالب متجر الكتروني لمدونات بلوجر 2015

قالب متجر الكتروني لمدونات بلوجر 2015

محمد الكناني    1 تعليق   

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

معاينة القالب
تحميل القالب

قالب آندرويد لمدونات بلوجر 2015

قالب آندرويد لمدونات بلوجر 2015

محمد الكناني    2 تعليقات   

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

التحميل - المعاينة 

كيف تحذف الأدوات التي لا تقبل الحذف في بلوجر

كيف تحذف الأدوات التي لا تقبل الحذف في بلوجر

محمد الكناني    تعليق   

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

و الآن مع شرح طريقة حذف الأدوات التي لا يمكن حذفها 

1. اذهب الي ;

 لوحة التحكم >  قالب > تحرير HTML > ابحث عن اسم الأداة المراد حذفها .

نحن في هذا المثال قمنا بالعمل الطريقة على Attribution

2. نبحث عنها في القالب سنجدها على هذا الشكل ;

<b:widget id='Attribution1' locked='True' title='' type='Attribution'>

3. قم بتغيير كلمة True الى False  ليصبح الكود كالتالي :

<b:widget id='Attribution1' locked='False' title='' type='Attribution'>

ثم نقوم بحفظ القالب .

   الان اذهب الي التخطيط وستجد ان الاداة قد اضيف لها زر الحذف ويمكنها الان ازالتها.

  ملحوظة ;  لمعرفة اسم الأداة ما عليك سوى الذهاب الى تخطيط تم تضغط على الأداة الغير القابلة للحدف و نتيجة ,

اظهار صورتك بجانب المدونة على نتائج محركات البحث

اظهار صورتك بجانب المدونة على نتائج محركات البحث

محمد الكناني    تعليق   

أول عملية هي ربط موقعنا بحساب جوجل بليس "+Google" الخاص بنا يمكنك ذلك بإتباع خطوات التالية :
 

1. ربط مدونتك بحسابك على جوجل بلس ; اضغط هنا 

2. بعد الإنتهاء لاتنسى اضافة رابط مدونة الى حسابك الشخصي على جوجل بليس إتبع هذا الرابط ; اضغط هنا , أضف المدونة في الخيار الثاني contributes to , ثم ضغط  Save .

الآن نمر للأهم، وهي بعض التعديلات فى قالب مدونتنا :

1. اذهب الى قالب .

2. تحرير HTML .  

3. باستعمال CTRL+F   ابحث عن

<head>

4. ثم تحته مباشرة أضف الكود التالي : 

رابط الكود

5. استبدال الرابط حسابي برابط حسابك على جوجل بلس .

6. المرحلة الأخيرة ، وهي التأكد من العملية . توجه الى اضغط هنا ثم ضع رابط مدونتك وضغط  PREVIEW 

قالب مدونة المحترف الجديد 2015

قالب مدونة المحترف الجديد 2015

محمد الكناني    تعليق   

مميزات قالب المحترف الجديد للبلوجر : 

• سريع و ذوا ارشفة سريعة
• سلايد شو احترافي
• قائمة افقية غاية في الروعة و بتقنية Css
• تغيير لون عناوين المواضيع عند مرور الماوس فوقها
• عدة  اماكن مخصصة لوضع اعلاناتك
• متوافق مع جميع اصدارات المتصفحات
• خاصية اقرأ المزيد روعة
• شعار مدونة بجانب اشهار ادسنس
• أداة هل أعجبك الموضوع و اداة مزيد من المواضيع اسفل كل موضوع

اضغط هنا لتحميل القالب .

قالب بلوجر مجلة احترافية

قالب بلوجر مجلة احترافية

محمد الكناني    تعليق   

مميزات القالب : 

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

تحميل و مشاهدة القالب 


    تحميل القالب    

• كود التصنيفات على البلوك الخاص بالصفحة الرئيسية

 

<div class="content-cat" >
     <center>

     <script type="text/javascript" src=" http://yourjavascript.com/05351118128/jquery.js">
<script type="text/javascript">
$(document).ready(function(){
$(".accordion h3:first").addClass("active");
$(".accordion p:not(:first)").hide();
$(".accordion h3").click(function(){
$(this).next("p").slideToggle("slow")
.siblings("p:visible").slideUp("slow");
$(this).toggleClass("active");
$(this).siblings("h3").removeClass("active");
});
});
</script>


<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://lh5.ggpht.com/_ZXEvc1YiIko/TLzMljzSYFI/AAAAAAAAA4g/FW2VlpJHWfE/s128/no-image.blogspacetech.jpeg";
showRandomImg = true;

jimgwidth = 80;
jimgheight = 80;
jfntsize = 12;
jacolor = "#E67C15";
jaBold =true;

jtext = "التعليقات";
jshowPostDate = false;

jsummaryPost = 120;
summaryFontsize = 0;
summaryColor = "#000";

numposts =5
label = "الرياضة ";
home_page = "http://hukmat.blogspot.com//";

</script>

<div class="accordion">
<script src="https://dz-site.googlecode.com/files/new.recent-posts.js" type="text/javascript"></script>
</div>
<!– google_ad_section_end –></!–>
</center>
<div class="clear">
</div>
</div> 

•  والان اضيف كود الخاص بالفيديو على اليسار

<div class="widget-content">
<div class="content-vf">
     <center>

     <script type="text/javascript" src="
http://yourjavascript.com/05351118128/jquery.js">
<script type="text/javascript">
$(document).ready(function(){
$(".accordion h3:first").addClass("active");
$(".accordion p:not(:first)").hide();
$(".accordion h3").click(function(){
$(this).next("p").slideToggle("slow")
.siblings("p:visible").slideUp("slow");
$(this).toggleClass("active");
$(this).siblings("h3").removeClass("active");
});
});
</script>


<script language="JavaScript">
imgr = new Array();
imgr[0] =
"http://lh5.ggpht.com/_ZXEvc1YiIko/TLzMljzSYFI/AAAAAAAAA4g/FW2VlpJHWfE/s128/no-image.blogspacetech.jpeg";
showRandomImg
 = true;

jimgwidth = 80;
jimgheight = 80;
jfntsize = 12;
jacolor = "#E67C15";
jaBold =true;

jtext = "التعليقات";
jshowPostDate = false;

jsummaryPost = 120;
summaryFontsize = 0;
summaryColor = "#000";

numposts =6
label = "فيديو";
home_page = "http://hukmat.blogspot.com//";

</script>

<div class="accordion">
<script
src="https://dz-site.googlecode.com/files/new.recent-posts.js"
type="text/javascript"></script><script
src="http://www.wtn24.com/feeds/posts/default/-/Video?max-results=6&orderby=published&alt=json-in-script&callback=showrecentposts"></script></div>
</center>
</div>
</div>

• لإظهار السلايد شو إبحث عن  "فقه الدعوة"  و غيرها بإسم تسميتك المفضلة .