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


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

المثال المباشر كما هو موجود بمدونتنا :)

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



    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" >
    /***********************************************
    * Scroll To Top Control script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * Modified by www.helperblogger.com
    * This notice MUST stay intact for legal use
    * Visit Project Page at http://www.dynamicdrive.com for full source code
    ***********************************************/
    var scrolltotop={
        //startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
        //scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (0=top).
        setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
        controlHTML: '<img src="http://im13.gulfup.com/2012-04-24/133527218372.png" />', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
        controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ bottom of window corner
        anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
        state: {isvisible:false, shouldvisible:false},
        scrollup:function(){
            if (!this.cssfixedsupport) //if control is positioned using JavaScript
                this.$control.css({opacity:0}) //hide control immediately after clicking it
            var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
            if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists
                dest=jQuery('#'+dest).offset().top
            else
                dest=0
            this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
        },
        keepfixed:function(){
            var $window=jQuery(window)
            var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
            var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
            this.$control.css({left:controlx+'px', top:controly+'px'})
        },
        togglecontrol:function(){
            var scrolltop=jQuery(window).scrollTop()
            if (!this.cssfixedsupport)
                this.keepfixed()
            this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
            if (this.state.shouldvisible && !this.state.isvisible){
                this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
                this.state.isvisible=true
            }
            else if (this.state.shouldvisible==false && this.state.isvisible){
                this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
                this.state.isvisible=false
            }
        },
    
        init:function(){
            jQuery(document).ready(function($){
                var mainobj=scrolltotop
                var iebrws=document.all
                mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
                mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
                mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
                    .css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
                    .attr({title:'Scroll Back to Top'})
                    .click(function(){mainobj.scrollup(); return false})
                    .appendTo('body')
                if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text
                    mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text
                mainobj.togglecontrol()
                $('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
                    mainobj.scrollup()
                    return false
                })
                $(window).bind('scroll resize', function(e){
                    mainobj.togglecontrol()
                })
            })
        }
    }
    scrolltotop.init()
     </script>
وبهده الطريقه تكون الاضافه موجوده بمدونتك 
ملاحظه لتغيير الصوره قم بتغيير 
http://im13.gulfup.com/2012-04-24/133527218372.png
الى الصوره التى تريدها  



أضافة مميزة لموقعك أو مدونتك وهي اضافة المصحف الكريم بشكل جميل



أولا أدخل على الموقع التالي :
http://khadejah.net/

بعد ذلك قم بالضغط على المواقع


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

قم بنسخ الكود

بالنسبة لبلوجر :
اذهب الى لوحة تحكم بلوجر
اضغط على التخطيط ثم اضافة أداة
HTML/Javascript
تم قم بلصق الكود
احفظ التغييرات


بالنسبة لووردبريس :
اذهب الى لوحة تحكم ووردبريس
اضغط على المظهر ثم المربعات الجانبية
قم بإزاحة نص أو HTML الى المربعات الجانبية Sidebar
تم قم بلصق الكود
احفظ التغييرات
و مبروك عليك الإضافة
في هذه التدوينه الى كيفية اضافة سلايد شو Slidershow احترافي لمدونات بلوجر بطريقه سهله جدا ومميزه حيث تعتمد هذه الاضافه على كود الجافا سكريب ,  يعني تقدر تضيف هذا السلايد شو الى مدونتك بخطوه واحده فقط وهي اضافة اداهHTML/JavaScript  , مايميز هذا السلايد شو انه يضفي لمسة جميلة على المدونات حيث يساهم بشكل كبير في إثارة انتباه الزائر إلى أكثر المواضيع أهمية. الأمر بسيط جدا

اضافة سلايد شو لمدونات بلوجر
انتقل إلى لوحة تحكم مدونتك
 إختر "تخطيط" ثم إضافة أداة ثم اختر HTML/Javascript

والآن الصق داخل المستطيل الكود التالي
 

<style type="text/css">
/* alb33dani.blogspot.com */
#sliderFrame {position:relative;width:700px;margin: 0 auto 40px;}
       
#slider {
width:700px;height:306px;/* Make it the same size as your images */
background:#fff urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7MlZvUkHXdZNc3c8WSuw_AASju18h0rV5V_YZmk73Ij5IL_RIqY_cl2hfNBeCBMFN2PVfhKVvUSKdxFTH9KYw-QA5BENIixxHnv2yMOtHTx_jAk5yHCeITBelHwk5QUfzDm5vGuw4ogJE/s1600/loading.gif) no-repeat 50% 50%;
position:relative;
margin:0 auto;/*make the image slider center-aligned */
box-shadow: 0px 1px 5px #999999;
    }
#slider img {
position:absolute;
border:none;
display:none;
    }
/* the link style undefinedif an image is wrapped in a link) */
#slider a.imgLink {
z-index:2;
display:none;position:absolute;
top:0px;left:0px;border:0;padding:0;margin:0;
width:100%;height:100%;
    }
/* Caption styles */
div.mc-caption-bg, div.mc-caption-bg2 {
position:absolute;
width:100%;
height:auto;
padding:0;
left:0px;
bottom:15px;
z-index:3;
overflow:hidden;
font-size: 0;
    }
div.mc-caption-bg {
background-color:black;
    }
div.mc-caption {
font: bold 14px/20px Arial;
color:#EEE;
z-index:4;
padding:10px 0;
text-align:center;
    }
div.mc-caption a {
color:#FB0;
    }
div.mc-caption a:hover {
color:#DA0;
    }
/* ------ built-in navigation bullets wrapper ------*/
div.navBulletsWrapper  {
top:320px; left:280px; /* Its position is relative to the #slider */
width:150px;
background:none;
padding-left:20px;
position:relative;
z-index:5;
cursor:pointer;
    }
/* each bullet */
div.navBulletsWrapper div
    {
width:11px; height:11px;
background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWOiD2ITQoZxuVLAvsjQ2aUkmZ7GWu_kwRvjGxZ29pFAb7PtaFZO2ha88V2dWzhsBjYl_7ceuumQ0aaMCFlXMnN5Ob8ux0VoRUxXIc5hjIRYkDcrdSt16uP50nUWmZN1neKUWcRhN0-K2H/s1600/bullet.png) no-repeat 0 0;
float:left;overflow:hidden;vertical-align:middle;cursor:pointer;
margin-right:11px;/* distance between each bullet*/
_position:relative;/*IE6 hack*/
    }
div.navBulletsWrapper div.active {background-position:0 -11px;}
/* --------- Others ------- */
#slider
    {
transform: translate3dundefined0,0,0);
-ms-transform:translate3dundefined0,0,0);
-moz-transform:translate3dundefined0,0,0);
-o-transform:translate3dundefined0,0,0);
    }
</style>
<script src="http://dimpost.googlecode.com/files/js-image-slider.js" type="text/javascript"></script>
<div id="sliderFrame">
<div id="slider">
<a href="#"><img src="رابط الصوره الاولى" alt="عنوان الموضوع الاول" /></a>
<a href="#"><img src="رابط الصوره الثانيه" alt="عنوان الموضوع الثاني" /></a>
<a href="#"><img src="رابط الصوره الثالثه"alt="عنوان الموضوع الثالث" /></a>
<a href="#"><img src="رابط الصوره الرابعه"alt="عنوالن الموضوع الرابع" /></a>
<a href="#"><img src="رابط الصوره الخامسه" alt="عنوان الموضوع الخامس"/></a>
</div>
</div>


مايجب عليك تغييره

عنوان الموضوع : استبدلها بعنوان الموضوع المراد عرضه في السلايد شو.رابط صورة الموضوع : استبدلها برابط صورة الموضوع المراد عرضه بالسلايد شو.
# : استبدلها برابط الموضوع المراد عرضه بالسلايد شو.
700px : لتغيير عرض السلايد شو .
306px:لتغيير ارتفاع السلايدشو.

وبالاخير قم بحفظ الاداه ومبروك عليك السلايدشو
يصادف الكثير من المدونين والباحيثن عن  قوالب بلوجر جميلة و معربة لاكن بها أخطاء ، ومن هاذه الأخطاء الكثيرة هو تمدد قالب بلوجر الى عرض فارغ مما قد يأثر سلبا على المدونة ،ولهذا السبب قمنا بكتابه هذا الشرح ليفيد الجميع والباحثين عن حلول لهذه المشكله
شكل القالب معى المشكلة
أولا عليك الاتجاه الى لوحة تحكم بلوجر ثم قم بأختيار كلمة قالب من الشريط الجانبي ثم اضغط على كلمة تحرير HTML
سوف يضهر لك مستطيل فيه أكواد HTML الخاصة بقالبك ثم اضغط مرة واحدة داخل المستطيل لتستطيع الكتابة ،
عليك البحث ( للبحث اضغط  Ctrl+F )  داخل أكواد HTML عن هاذا الوسم
    ]]></b:skin>

عندما تجده ضع هاذا الوسم قبله يعني فوقه
    html {overflow-x: hidden;}

    ثم قم بحفض القالب
إضافة المتابعة عبر البريد الإلكتروني المميزة لمدونات بلوجر


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

طريقة التركيب سهلة جدا وليس فيها أي تعقيدات فقط قم بالدخول إلى لوحة تحكم مدونتك ثم إلى التخطيط ثم إضافة أداة وبعد ذلك إبحث عن أداة Html/Javascript وقم بنسخ الكود التالي في الصندوق الفارغ  :
 

<h3 class="title"> تابعنا عبر البريد الالكترونى</h3>  
<div class="widget-content">
<div class="intro" style="border:#ececec 1px solid">
<a style="clear:right;margin-bottom:0.5em;margin-left:1em" imageanchor="1">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNAvmGwcXJ1R1TIKBIfS-Nqs6lDKeKtcDWHGrgSwcVbE84yI7XD5RNqYes0J-OB9AuvRsjMLJAgn0SMeHGkGSSexzNKa4E-Bjv9He9rab1oY15-8oEXQCb4B-2FhTZLpTvcjb2tBo5tf0/s512/Social_Email_RSS.png" />
</a>
<p>أدخل بريدك الإلكتروني ليصلك كل جديد بالمدونه ومتابعتنا بكل سهوله ولا تنسي تفعيل الاشتراك من خلال صندوق الوارد بالبريد.</p>
<form rel="nofollow" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=ency-bl', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" method="post" action="http://feedburner.google.com/fb/a/mailverify" dir="ltr">
<input type="hidden" value="gateblogs" name="uri" />
<input type="hidden" value="en_US" name="loc" />     <p class="email-form">
<input class="sub" type="text" name="email" />     <input class="subbutton" type="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAi5ORhz_0Z2sJzLBaxOSm2aPRiC0gTxX0egx-xlg4B5Y9Fs-xsM51sFmfVF-XLQVUXL1zs_RwH_BFJ-NhgQMh8VXgbHAEY1rutkrxdPjBJrmaq3F4HvMBLlwuO0QpMqQf_G9xm4SoW4c/s1600/button-mail.gif" alt="submit" />
</p>
</form>
</div>
</div>
<div class="clear">
</div>
<span class="widget-item-control">
<span class="item-control blog-admin">
 <a class="quickedit" title="تحرير" rel="nofollow" target="configHTML8" onclick="return _WidgetManager._PopupConfig(document.getElementById("html8"));" href="http://www.blogger.com/rearrange?blogID=5271883380863636842&widgetType=HTML&widgetId=HTML8&action=editWidget&sectionId=sidebar-
ads">
<img height="18" width="18" src="http://img1.blogblog.com/img/icon18_wrench_allbkg.png" alt="" />
</a>
</span>
</span>
<div class="clear">
</div>
 

  كيفية التحكم الأمثل بالإضافة

قم بتغيير رابط قائمتك في الفيدبرنر بالتعديل على : http://feedburner.google.com/fb/a/mailverify?uri=ency-bl
  • يمكنك تغيير عنوان الأداة من خلال التعديل على : <h3 class="title"> تابعنا عبر البريد الالكترونى</h3>
  • للتعديل على النص قم بالتعديل على : <p> أدخل بريدك الإلكتروني ليصلك كل جديد بالمدونه ومتابعتنا بكل سهوله ولا تنسي تفعيل الاشتراك من خلال صندوق الوارد بالبريد. </p>
  • للتعديل على عرض وطول الأداة بما يتناسب مع قالبك عدل على :  width=550,height=520
اليوم سأشرح طريقة إضافة شاحنة فيسبوك على مدونتك من أجل زيادة عدد المعجبيك. حيث سيعجب زوار مدونتك بهذه الشاحنة و سيقومون بالضغط عليها و بتالي سوف تكسب المزيد من المعجبين إليكم طريقة إضافتها.
طريقه التركيب 1
اولاً تعرف كيف تضيف اكواد الـ HTML/JavaScript


طريقه اضافه اكواد Html الى المدونه
أذا كنت تعرف لا حاجة للشرح المصور
لوحة التحكم بلوجر >عناصر الصفحة > إضافة أداة > HTML/JavaScript

ضع الكود ادناااه 
<!--www.Diamond4host.com--> <div style="position: fixed; z-index: 65535; left: 0px; bottom: -3px; width:100%;">
<marquee><a href="https://www.facebook.com/Diamond4HostCo" target="blank"> <abbr title="Follow us at Facebook"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBgJS01ewf85HkwkldE4HtVl35g-cvPBMYukv0tp0pqD7mDlBbNrZnjO2EpCuB9NzsG-Ht1qLjMn0Rb_BhNW8TyJ0QQKm7q0_ODbdiltu5AwcBejBlqb4zRE2KDeYNxMZIe2aR48Giz8Rv/s69/I1.png"/> </abbr> </a> </marquee> </div>
 

قم بتبديل التالي
https://www.facebook.com/Diamond4HostCo
رابط مدونتك على الفيس بوك
left
الاتجاه
Follow us at Facebook
العنوان عند وضع الماوس


للمزيد تابعنا عبر الفيسبوك او جوجل بلص

قناتنا على يوتيوب