tag:blogger.com,1999:blog-87226357330751344332024-03-05T14:21:08.877-08:00ورشة مدونUnknownnoreply@blogger.comBlogger114125tag:blogger.com,1999:blog-8722635733075134433.post-22804231751404782132015-12-27T10:36:00.001-08:002015-12-27T10:54:08.388-08:00حصريا الطريقة الصحيحة لإضافة سكريبت إقرأ المزيد لمدونات بلوجر<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisQ6MDU9aYio-gFlUEUBPwbbqS83ogLLWjjAybuFRU24QxBOAC9hKPQ0npMz7dctzUqh3pCBo5d30M0AhKCwrCEg5TgDc0EbmNaA_b__cBh8uPdZOe50BuztbDy6ihQEF6cl4KkG-WZ5M/s1600/%25D8%25A5%25D9%2582%25D8%25B1%25D8%25A3+%25D8%25A7%25D9%2584%25D9%2585%25D8%25B2%25D9%258A%25D8%25AF+-+read+more.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisQ6MDU9aYio-gFlUEUBPwbbqS83ogLLWjjAybuFRU24QxBOAC9hKPQ0npMz7dctzUqh3pCBo5d30M0AhKCwrCEg5TgDc0EbmNaA_b__cBh8uPdZOe50BuztbDy6ihQEF6cl4KkG-WZ5M/s1600/%25D8%25A5%25D9%2582%25D8%25B1%25D8%25A3+%25D8%25A7%25D9%2584%25D9%2585%25D8%25B2%25D9%258A%25D8%25AF+-+read+more.png" /></a></div>
<div dir="RTL" style="direction: rtl; margin: 0cm 0cm 0.0001pt; unicode-bidi: embed;">
أداة إقرأ المزيد أو ما يسمى read more، من الإضافات الضرورية في المدونات أو المواقع مهما كان نوعها، فهي تتحكم في حجم المحتوى الذي يظهر في الصفحة الرئيسية و بحيث يتم تلخيص المواضيع في عدة كلمات أو جمل يتم التحكم فيها من خلال عدد الأحرف التي تريد الظهور، بالأضافة إلى التحكم في إرتفاع و عرض الصور المصغرة للموضيع img thumbnail ، هذا كله يجعل مظهر المدونة متناسق مع عرض عدد أكبر من التدوينات في مساحة أقل ، ليكون سهل على الزائر تصفح المواضيع بكل سهولة.<br />و لكن المشكلة هي أن أغلب هذه السكريبتات بها أخطاء ، مما يجعل هذه الإضافة تطبق حتى على الصفحات الثابتة بالمدونة ، أما اليوم فقد أصلحت المشكل و قمت بجلب هذا السكريبت السهل في التركيب كي لا أطيل عليكم ننتقل للشرح.<br /><br />1- نذهب للوحة التحكم بلوجرثم القالب ثم تحرير html . (خد نسخة إحتياطية )<br />2- ننقر و سط الأكواد ثم ننقر على الزرين ctrl و f دفعة واحدة ، ينبثق مربع البحث و نبحث عن الكود التالي<b style="font-family: inherit;"><span dir="LTR" style="color: blue; font-size: 13.5pt;">: &lt;data:post.body/&gt; </span></b></div>
<span style="color: red;">ملاحظة :</span> قد تجد أكثر من واحد الأخير هو المقصود.<br />3- نستبدل الكود الذي وجدناه بهذا الكود :<blockquote class="tr_bq" style="direction: rtl; margin: 0cm 0cm 0.0001pt; unicode-bidi: embed;">
<span style="font-family: inherit;"><span dir="LTR" style="font-size: 13.5pt;">&lt;b:if
cond='data:blog.pageType != &amp;quot;static_page&amp;quot;'&gt;</span><span dir="LTR" style="font-size: 13.5pt;">&lt;b:if
cond='data:blog.pageType != &amp;quot;item&amp;quot;'&gt;</span><span dir="LTR" style="font-size: 13.5pt;">&lt;div
expr:id='&amp;quot;summary&amp;quot; +
data:post.id'&gt;&lt;data:post.body/&gt;&lt;/div&gt;</span><span dir="LTR" style="font-size: 13.5pt;">&lt;script
type='text/javascript'&gt;createSummaryAndThumb(&amp;quot;summary&lt;data:post.id/&gt;&amp;quot;,&amp;quot;&lt;data:post.url/&gt;&amp;quot;,&amp;quot;&lt;data:post.title/&gt;&amp;quot;);&lt;/script&gt;</span><span dir="LTR" style="font-size: 13.5pt;"> &lt;span
class='readmore' style='float:right;'&gt;&lt;a
expr:href='data:post.url'&gt;</span><span lang="AR-SA" style="font-size: 13.5pt;">إقرأ المزيد </span><span dir="LTR"></span><span dir="LTR" style="font-size: 13.5pt;"><span dir="LTR"></span>&amp;#187;&lt;/a&gt;&lt;/span&gt;&lt;/b:if&gt;&lt;/b:if&gt;<br /><o:p></o:p></span><span dir="LTR" style="font-size: 13.5pt;">&lt;b:if
cond='data:blog.pageType ==
&amp;quot;item&amp;quot;'&gt;&lt;data:post.body/&gt;&lt;/b:if&gt;</span><span dir="LTR" style="font-size: 13.5pt;">&lt;b:if
cond='data:blog.pageType ==
&amp;quot;static_page&amp;quot;'&gt;&lt;data:post.body/&gt;&lt;/b:if&gt;</span></span></blockquote>
<div dir="RTL" style="direction: rtl; margin: 0cm 0cm 0.0001pt; unicode-bidi: embed;">
4- الآن نقوم بالبحث عن الوسم <span style="font-family: inherit;"><span dir="LTR" style="font-size: 13.5pt;"> </span><b><span dir="LTR" style="color: blue; font-size: 13.5pt;"> &lt;/head&gt;<span class="apple-converted-space"> </span></span></b></span>و نقوم بلصق هذا الكود قبله مباشرة:</div>
<blockquote class="tr_bq" style="direction: rtl; margin: 0cm 0cm 0.0001pt; unicode-bidi: embed;">
<span style="font-family: inherit;"><span style="font-size: 18px;">&lt;script type=&#039;text/javascript&#039;&gt;</span><span style="font-size: 18px;">posts_no_thumb_sum = </span><span style="color: #cc0000; font-size: 18px;">490</span><span style="font-size: 18px;">;</span><span style="font-size: 18px;">posts_thumb_sum = </span><span style="color: #e69138; font-size: 18px;">400</span><span style="font-size: 18px;">;</span><span style="font-size: 18px;">img_thumb_height = </span><span style="color: blue; font-size: 18px;">160</span><span style="font-size: 18px;">;</span><span style="font-size: 18px;">img_thumb_width = </span><span style="color: cyan; font-size: 18px;">180</span><span style="font-size: 18px;">;</span><span style="font-size: 18px;">&lt;/script&gt;</span><span style="font-size: 18px;">&lt;script type=&#039;text/javascript&#039;&gt;</span><span style="font-size: 18px;">//&lt;![CDATA[</span><span style="font-size: 18px;">function removeHtmlTag(strx,chop){</span><span style="font-size: 18px;">if(strx.indexOf(&quot;&lt;&quot;)!=-1)</span><span style="font-size: 18px;">{</span><span style="font-size: 18px;">var s = strx.split(&quot;&lt;&quot;);</span><span style="font-size: 18px;">for(var i=0;i&lt;s.length;i++){</span><span style="font-size: 18px;">if(s[i].indexOf(&quot;&gt;&quot;)!=-1){</span><span style="font-size: 18px;">s[i] = s[i].substring(s[i].indexOf(&quot;&gt;&quot;)+1,s[i].length);</span><span style="font-size: 18px;">}</span><span style="font-size: 18px;">}</span><span style="font-size: 18px;">strx = s.join(&quot;&quot;);</span><span style="font-size: 18px;">}</span><span style="font-size: 18px;">chop = (chop &lt; strx.length-1) ? chop : strx.length-2;</span><span style="font-size: 18px;">while(strx.charAt(chop-1)!=&#039; &#039; &amp;&amp; strx.indexOf(&#039; &#039;,chop)!=-1) chop++;</span><span style="font-size: 18px;">strx = strx.substring(0,chop-1);</span><span style="font-size: 18px;">return strx+&#039;...&#039;;</span><span style="font-size: 18px;">}</span><span style="font-size: 18px;">function createSummaryAndThumb(pID, pURL, pTITLE){</span><span style="font-size: 18px;">var div = document.getElementById(pID);</span><span style="font-size: 18px;">var imgtag = &quot;&quot;;</span><span style="font-size: 18px;">var img = div.getElementsByTagName(&quot;img&quot;);</span><span style="font-size: 18px;">var summ = posts_no_thumb_sum;</span><span style="font-size: 18px;">if(img.length&gt;=1) {</span><span style="font-size: 18px;">imgtag = &#039;&lt;span class=&quot;posts-thumb&quot; style=&quot;float:</span><b><span dir="LTR" style="color: lime; font-size: 13.5pt;">left</span></b><span style="font-size: 18px;">; margin-</span><b><span dir="LTR" style="color: #351c75; font-size: 13.5pt;">right</span></b><span style="font-size: 18px;">: 10px;&quot;&gt;&lt;a href=&quot;&#039;+ pURL +&#039;&quot; title=&quot;&#039;+ pTITLE+&#039;&quot;&gt;&lt;img src=&quot;&#039;+img[0].src+&#039;&quot; width=&quot;&#039;+img_thumb_width+&#039;px&quot; height=&quot;&#039;+img_thumb_height+&#039;px&quot; /&gt;&lt;/a&gt;&lt;/span&gt;&#039;;</span><span style="font-size: 18px;">summ = posts_thumb_sum;</span><span style="font-size: 18px;">}</span><span style="font-size: 18px;"><br /></span><span style="font-size: 18px;">var summary = imgtag + &#039;&lt;div&gt;&#039; + removeHtmlTag(div.innerHTML,summ) + &#039;&lt;/div&gt;&#039;;</span><span style="font-size: 18px;">div.innerHTML = summary;</span><span style="font-size: 18px;">}</span><span style="font-size: 18px;">//]]&gt;</span><span style="font-size: 18px;">&lt;/script&gt;</span><span style="font-size: 18px;"><br /></span><span style="font-size: 18px;">&lt;b:if cond=&#039;data:blog.pageType != &amp;quot;static_page&amp;quot;&#039;&gt;</span><span style="font-size: 18px;">&lt;b:if cond=&#039;data:blog.pageType != &amp;quot;item&amp;quot;&#039;&gt;</span><span style="font-size: 18px;">&lt;style type=&#039;text/css&#039;&gt;</span><span style="font-size: 18px;">.post-footer {display: none;}</span><span style="font-size: 18px;">.post {margin-bottom: 10px; border-bottom: 1px dotted #E6E6E6; padding-bottom: 20px;}</span><span style="font-size: 18px;"> .readmore a {text-decoration: none; }</span><span style="font-size: 18px;">&lt;/style&gt;</span><span style="font-size: 18px;">&lt;/b:if&gt;</span><span style="font-size: 18px;">&lt;/b:if&gt;</span></span></blockquote>
<div dir="RTL" style="direction: rtl; margin: 0cm 0cm 0.0001pt; unicode-bidi: embed;">
<span style="font-family: inherit;"><span dir="LTR" style="font-size: 18px;"></span></span></div>
<div dir="RTL" style="direction: rtl; margin: 0cm 0cm 0.0001pt; unicode-bidi: embed;">
<br />تعديلات على الكود:<br />بالنسبة لهذا الكود فهو يجعل الصورة في اليمين إذا أردت العكس قم بتغير<b style="font-family: inherit;"><span dir="LTR" style="color: #351c75; font-size: 13.5pt;">right</span></b><span class="apple-converted-space" style="font-family: inherit;"><span dir="LTR" style="color: #351c75; font-size: 13.5pt;"> </span></span><span dir="LTR">ب<span style="font-family: inherit;"><span style="font-size: 13.5pt;"> left </span></span></span>و قم بتغير<b style="font-family: inherit;"><span dir="LTR" style="color: lime; font-size: 13.5pt;">left</span></b><span class="apple-converted-space" style="font-family: inherit;"><span dir="LTR" style="color: #274e13; font-size: 13.5pt;"> </span></span><span dir="LTR">ب<span style="font-family: inherit;"><span style="font-size: 13.5pt;"> right .</span></span></span></div>
يمكنك أيضا تغير هذه التفاصيل:<div dir="RTL" style="direction: rtl; margin: 0cm 0cm 0.0001pt; unicode-bidi: embed;">
<span style="font-family: inherit;"><span dir="LTR" style="color: #cc0000; font-size: 13.5pt;">490<span class="apple-converted-space"> </span></span></span>عدد أحرف النص في حالة عدم وجود صورة</div>
<div dir="RTL" style="direction: rtl; margin: 0cm 0cm 0.0001pt; unicode-bidi: embed;">
<span style="font-family: inherit;"><span dir="LTR" style="color: #e69138; font-size: 13.5pt;">400<span class="apple-converted-space"> </span></span></span>عدد أحرف النص مع وجود الصورة</div>
<div dir="RTL" style="direction: rtl; margin: 0cm 0cm 0.0001pt; unicode-bidi: embed;">
<span style="font-family: inherit;"><span dir="LTR" style="color: blue; font-size: 13.5pt;">160<span class="apple-converted-space"> </span></span></span>إرتفاع الصورة</div>
<div dir="RTL" style="direction: rtl; margin: 0cm 0cm 0.0001pt; unicode-bidi: embed;">
<span style="font-family: inherit;"><span dir="LTR" style="color: cyan; font-size: 13.5pt;">180</span><span class="apple-converted-space"><span dir="LTR" style="font-size: 13.5pt;"> </span></span></span>عرض الصورة<br />ثم قم بحفظ القالب<br />إنتهى الدرس أي إستفسار لاتتردد في ترك تعليق ، دمتم بود .</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-66084900346326727502015-12-18T06:48:00.001-08:002015-12-27T10:58:50.920-08:00حل مشكلة نزول رسالة تعليقات بلوجر إلى أسفل صندوق التعليقات<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both;">
</div>
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb_ECFd7SFk2eDL6AS-as2zhDpwrCo9_5GzdMG_4qIn-WJUVmjhzvYnOLrXI1VD46FRCZv7pU4qP0vSnYI9hRkVdw0I0qdTISFTDEBBaspO3wpJDGF-P_rM4Hpud-eTpk1j_NuiLiVFPk/s1600/%25D8%25B1%25D8%25B3%25D8%25A7%25D9%2584%25D8%25A9+%25D8%25AA%25D8%25B9%25D9%2584%25D9%258A%25D9%2582%25D8%25A7%25D8%25AA+%25D8%25A8%25D9%2584%25D9%2588%25D8%25AC%25D8%25B1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb_ECFd7SFk2eDL6AS-as2zhDpwrCo9_5GzdMG_4qIn-WJUVmjhzvYnOLrXI1VD46FRCZv7pU4qP0vSnYI9hRkVdw0I0qdTISFTDEBBaspO3wpJDGF-P_rM4Hpud-eTpk1j_NuiLiVFPk/s1600/%25D8%25B1%25D8%25B3%25D8%25A7%25D9%2584%25D8%25A9+%25D8%25AA%25D8%25B9%25D9%2584%25D9%258A%25D9%2582%25D8%25A7%25D8%25AA+%25D8%25A8%25D9%2584%25D9%2588%25D8%25AC%25D8%25B1.png" /></a></div>
<br />
السلام عليكم و رحمة الله تعالى وبركاته<br />
تعتبر التعليقات خاصية مهمة في المداونات و المواقع عامة، و هي بمثابة الشريان الذي يصل بين المدون الناشر مع زوار المدونة كما أنها نقطة إلتقاء و إحتكاك الآراء و الأفكار، و بالتالي نخرج بأطروحة أن نجاح المدونة رهيين بكم و نوعية التفاعل الذي تحظى به من قبل الزوار و المتابعين ، موضوعنا اليوم في ورشة مدون يخص نظام تعليقات بلوجر و بالظبط رسالة التعليقات التي تكون أعلى صندوق التعليقات و يتم إنشائها بغرض تقديم إرشادات للراغب في التعليق أو حث الزوار على التفاعل و لكن المشكل هو بعد كتابة اول تعليق يتم إنزال رسالة التعليقات تحت صندوق التعليق وليس فوقه واظن أن بلوجر ترى أن الرسالة لم تعد بنفس القيمة طالما تم كتابة تعليق يحدث هذا بالخصوص في القوالب التي تم تكويدها حديثا و لم تحسن بشكل كامل بعد.<br />
<br />
و لحل هذا المشكل ما عليك سوى الذهاب للوحة تحكم بلوجر ثم القالب نأخد نسخة إحتياطية أولا ، بعدها ننقر تحرير html ثم ننقر وسط الأكواد، نضغط على الزرين ctrl و f في نفس الوقت سينبثق مستطيل البحث ثم نبحث عن هذا الكود:<br />
<blockquote class="tr_bq" style="clear: both; text-align: center;">
<b:includable id='threaded-comment-form' var='post'></blockquote>
<div class="separator" style="clear: both;">
أسفله بقليل سوف تجد هذا الوسم : <b style="color: blue;"><b:else/> </b>ضع بجواره الكود التالي :</div>
<blockquote class="tr_bq" style="clear: both; text-align: center;">
<div id='threaded-comment-form'></blockquote>
<div class="separator" style="clear: both;">
بعده بسطور قليلة سوف تجد الوسم </b:if> ضع قبله هذا الوسم <span style="color: blue;"><b></div> </b></span></div>
<div class="separator" style="clear: both;">
هذه صورة توضح الطريقة</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS7qH54x1-xOraArPeXEMWsQJLNjM-LsaEI7RuTKkySVHYDAAFufF0GCbES8T94hyphenhyphenQsGgJhqTeepp6K-PQDmXwwTHTB2tp9BZmLGhpKwMZvlyeiiQEj6VumnfusRn_o9CC8ISHLe_-7vM/s1600/comment.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="140" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS7qH54x1-xOraArPeXEMWsQJLNjM-LsaEI7RuTKkySVHYDAAFufF0GCbES8T94hyphenhyphenQsGgJhqTeepp6K-PQDmXwwTHTB2tp9BZmLGhpKwMZvlyeiiQEj6VumnfusRn_o9CC8ISHLe_-7vM/s400/comment.gif" width="400" /></a></div>
<div class="separator" style="clear: both;">
<br /></div>
<div class="separator" style="clear: both;">
في حالة لاحظت وجود أن هذه الأكواد أضيفت من قبل ، تجاوز هذه المرحلة و إنتقل إلى المرحلة الثانية:</div>
<div class="separator" style="clear: both;">
<br /></div>
<div class="separator" style="clear: both;">
إبحث عن هذا الكود:</div>
<blockquote class="tr_bq" style="clear: both; text-align: center;">
document.getElementById(domId).insertBefore(replybox, null);</blockquote>
<div class="separator" style="clear: both;">
ثم إستبدله بهذا الكود:</div>
<blockquote class="tr_bq" style="clear: both; text-align: center;">
document.getElementById (domId). insertBefore (document.getElementById ('threaded-comment-form'), null);</blockquote>
<div class="separator" style="clear: both;">
ثم قم بحفظ القالب و عاين التعليقات لترى النتيجة، إلى هنا أكون قد أتممت لك الموضوع أي سؤال أو إستفسار لا تتردد في ترك تعليق ،</div>
<div class="separator" style="clear: both;">
دمتم بود في أمان الله.</div>
<div class="separator" style="clear: both;">
<br /></div>
<div class="separator" style="clear: both;">
<br /></div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-61999184626906172612015-11-13T06:50:00.001-08:002015-12-18T11:16:09.940-08:00حصريا: تقسيم المواضيع الطويلة في المدونة على شكل تبويبات<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator tr_bq" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk8zh8DTHjRgnRwzWiw9hJWX-Ws6-daqTYFOA1gg2OgQNF8QraFXZdnnKCUQTf5ru9S7xqQ3F_xqHgr8P8n1VhjXJda2d4o_EkR8DW3436nZ2FI7Lq9aswaYkCuatmPxgMXC_sq9SpOgE/s1600/%25D8%25AA%25D9%2582%25D8%25B3%25D9%258A%25D9%2585+%25D8%25A7%25D9%2584%25D9%2585%25D9%2588%25D8%25A7%25D8%25B6%25D9%258A%25D8%25B9+%25D8%25A7%25D9%2584%25D8%25B7%25D9%2588%25D9%258A%25D9%2584%25D8%25A9+%25D9%2581%25D9%258A+%25D8%25A7%25D9%2584%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9+%25D8%25B9%25D9%2584%25D9%2589+%25D8%25B4%25D9%2583%25D9%2584+%25D8%25AA%25D8%25A8%25D9%2588%25D9%258A%25D8%25A8%25D8%25A7%25D8%25AA.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk8zh8DTHjRgnRwzWiw9hJWX-Ws6-daqTYFOA1gg2OgQNF8QraFXZdnnKCUQTf5ru9S7xqQ3F_xqHgr8P8n1VhjXJda2d4o_EkR8DW3436nZ2FI7Lq9aswaYkCuatmPxgMXC_sq9SpOgE/s1600/%25D8%25AA%25D9%2582%25D8%25B3%25D9%258A%25D9%2585+%25D8%25A7%25D9%2584%25D9%2585%25D9%2588%25D8%25A7%25D8%25B6%25D9%258A%25D8%25B9+%25D8%25A7%25D9%2584%25D8%25B7%25D9%2588%25D9%258A%25D9%2584%25D8%25A9+%25D9%2581%25D9%258A+%25D8%25A7%25D9%2584%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9+%25D8%25B9%25D9%2584%25D9%2589+%25D8%25B4%25D9%2583%25D9%2584+%25D8%25AA%25D8%25A8%25D9%2588%25D9%258A%25D8%25A8%25D8%25A7%25D8%25AA.png" /></a></div>
<br />
السلام عليكم ورحمة الله تعالى و بركاته.<br />
أحيانا أثناء تصفحنا للمواضيع في المدونات و المواقع نشعر بالتعب في أعيننا و نحن نحاول قراءة بعض النصوص الطويلة ، و كأن الكاتب أو المدون أفرط في الكتابة، و في هذه الحالة سرعان ما ننفر من الموضوع خصوصا عند غياب التنسيق و خلو الموضوع من الصور ، و درس اليوم هو كيفية إخفاء أجزاء الموضوع خلف تبويبات وذلك مستعينين بتقنية ajax ،بحيث تضهر أزرار تحت الموضوع كلما نقرت على زر تظهر لك تتمة الموضوع و ذلك دون أن يحدث أدنى تغير في رابط المشاركة، غالبا ما تعتمد هذه الإضافة في منصات أخرى متطورة و لكن اليوم قمت بجلبها لكم لتلائم منصة البلوغر فكلما كان النص صغيرا و منسقا كلما تعطش الزائر لقراءته كي لا أطيل عليكم ننتقل للمعاينة ثم لشرح كيفية العمل,<br />
<div style="text-align: center;">
<span style="color: #b45f06; font-size: large;"><b><a href="http://freeblogfortest.blogspot.com/2015/11/blog-post_12.html" rel="nofollow" target="_blank">>>>المعاينة<<<</a></b></span></div>
1- نذهب للوحة التحكم بلوجر ثم القالب ثم نضغط تحرير html .<br />
2- ننقر و سط الأكواد ثم نضغط على الزرين ctrl وf في نفس الوقت ثم نبحث عن هذا الوسم <span style="color: blue;"><b><head></b></span><br />
3- ثم ضع هذا الكود تحته مباشرة:<br />
<blockquote class="tr_bq">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script></blockquote>
الأن ننتقل لشرح طريقة كتابة التدوينات<br />
1- إنشاء مشاركة جديدة<br />
2- إنقر على الزر html الموجود في أقصى يمين شريط الأدوات<br />
3- قم بمسح كل ما في الصفحة ثم ألصق فيها الكود التالي :<br />
<blockquote>
<style><br />.post-pagination {<br /> margin: 20px auto;<br /> text-align: center;<br /> width: 100%;<br />}<br />.button_1, .button_2, .button_3 {<br /> border: 2px solid #f4655f;<br /> font-weight: 900;<br /> padding: 6px 36px;<br /> color:#f4655f;<br /> transition:ease 0.69s !important;<br />}<br />.button_1:hover, .button_2:hover, .button_3:hover {<br /> background: none repeat scroll 0 0 #f4655f;<br /> color: #fff;<br /> text-decoration: none;<br />}<br /></style><br /><script type="text/javascript"><br />jQuery(document).ready(function(){<br />jQuery('.button_1').click(function(){<br />jQuery('.content_1').fadeIn('slow');<br /> jQuery('.content_2').fadeOut('fast');<br />jQuery('.content_3').fadeOut('fast');<br />jQuery(this).css('background','#F4655F');<br />jQuery(this).css('color','#fff');<br />jQuery('.button_2').css('background','#fff');<br />jQuery('.button_2').css('color','#F4655F');<br />jQuery('.button_3').css('background','#fff');<br />jQuery('.button_3').css('color','#F4655F');<br />return false;<br />});<br />jQuery('.button_2').click(function(){<br />jQuery('.content_1').fadeOut('fast');<br /> jQuery('.content_2').fadeIn('slow');<br />jQuery('.content_3').fadeOut('fast');<br />jQuery(this).css('background','#F4655F');<br />jQuery(this).css('color','#fff');<br />jQuery('.button_1').css('background','#fff');<br />jQuery('.button_1').css('color','#F4655F');<br />jQuery('.button_3').css('background','#fff');<br />jQuery('.button_3').css('color','#F4655F');<br />return false;<br />});<br />jQuery('.button_3').click(function(){<br />jQuery('.content_1').fadeOut('fast');<br /> jQuery('.content_2').fadeOut('fast');<br />jQuery('.content_3').fadeIn('slow');<br />jQuery(this).css('background','#F4655F');<br />jQuery(this).css('color','#fff');<br />jQuery('.button_1').css('background','#fff');<br />jQuery('.button_1').css('color','#F4655F');<br />jQuery('.button_2').css('background','#fff');<br />jQuery('.button_2').css('color','#F4655F');<br />return false;<br />});<br />});<br /></script><br /><div class="content_1"><br /><span style="color: red;">أضف المحتوى هنا</span><br /></div><br /><div class="content_2" style="display: none;"><br /><span style="color: red;">أضف المحتوى هنا</span><br /></div><br /><div class="content_3" style="display: none;"><br /><span style="color: red;">أضف المحتوى هنا</span><br /></div><br /><div class="post-pagination"><br /><a class="button_1" href="#">1</a><br /><a class="button_2" href="#">2</a><br /><a class="button_3" href="#">3</a><br /></div></blockquote>
<span style="color: blue;">تعديلات :</span><br />
قم بوضع المحتوى مكان عبارة "<span style="color: red;">أضف المحتوى هنا</span>" ستلاحظ أنها مكررة 3 مرات هذا يعني 3 تبويبات.<br />
بعدها إنقر على زر تأليف ستلاحظ أن الفقرة الأولى هي التي تظهر فقط ، لا عليك قم بنشر التدوينة و ستلاحظ النتيجة<br />
أي إستفسار لا تتردد في ترك تعليق.</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-61659032875809496752015-11-07T18:17:00.001-08:002015-12-18T11:16:09.931-08:00حصريا: أفضل سكريبت لعرض مواضيع بلوجر حسب التسميات<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsxCysUWLKKDtI95rIM53CyF705iOy2iixJ8pjRJ5l8RxixPjQdbeiAC3Tz8lfmTDdSWRGrZxnjKDYsUivBsjn5gWcJRYO5H4HthtHKI47NDErUFnIfWjQ0TzWFNu6VAjkNZySFwhBTd4/s1600/%25D8%25A5%25D8%25B8%25D9%2587%25D8%25A7%25D8%25B1+%25D8%25A7%25D9%2584%25D8%25AA%25D8%25AF%25D9%2588%25D9%258A%25D9%2586%25D8%25A7%25D8%25AA+%25D8%25AD%25D8%25B3%25D8%25A8+%25D8%25A7%25D9%2584%25D8%25AA%25D8%25B3%25D9%2585%25D9%258A%25D8%25A7%25D8%25AA.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsxCysUWLKKDtI95rIM53CyF705iOy2iixJ8pjRJ5l8RxixPjQdbeiAC3Tz8lfmTDdSWRGrZxnjKDYsUivBsjn5gWcJRYO5H4HthtHKI47NDErUFnIfWjQ0TzWFNu6VAjkNZySFwhBTd4/s1600/%25D8%25A5%25D8%25B8%25D9%2587%25D8%25A7%25D8%25B1+%25D8%25A7%25D9%2584%25D8%25AA%25D8%25AF%25D9%2588%25D9%258A%25D9%2586%25D8%25A7%25D8%25AA+%25D8%25AD%25D8%25B3%25D8%25A8+%25D8%25A7%25D9%2584%25D8%25AA%25D8%25B3%25D9%2585%25D9%258A%25D8%25A7%25D8%25AA.png" /></a></div>
السلام عليكم ورحمة الله تعالى وبركاته<br />
أصدقائي و أحبائي متابعي ورشة مدون الأوفياء، أولا أحب أن أعتذر منكم بسبب طول غيابي هذا و توقفي عن طرح المواضيع و عدم الإجابة عن تساؤلاتكم و إستفسارتكم ، لظروف خاصة حالة دون ذلك ، أحبابي كما و عاودتكم دائما بالجديد و المفيد في كل ما يتعلق بالتدوين و تطوير البلوجر، درس اليوم عبارة عن إضافة أو سكريبت يمكنك من إظهار مواضيع مدونتك حسب التسميات أو التصنيفات، سكريبت يعتمد على تقنية json و هو طريقة إحترافية لعرض التدوينات أو المشاركات في مدونتك ، بالإضافة إلى أنه يضفي جمالية على واجهة المداونة ، ومع إمكانية تغير الألوان والأيقونات. كي لا إطيل عليكم نمر للمعاينة ثم شرح طريقة التركيب<br />
<br />
<div style="text-align: center;">
<span style="color: orange; font-size: x-large;"><a href="http://freeblogfortest.blogspot.com/2015/11/blog-post_7.html" rel="nofollow" target="_blank">>>>معاينة <<<</a></span></div>
<div style="text-align: right;">
الآن شرح طريقة التركيب.</div>
<div style="text-align: right;">
1- إذهب للوحة التحكم بلوجر ثم القالب (خذ نسخة إحتياطية للقالب)</div>
<div style="text-align: right;">
2 - إنقر تحرير html ثم إنقر وسط الأكواد </div>
<div style="text-align: right;">
3- إضغط على الزرين ctrl و f في نفس الوقت ،سيظهر مربع البحث ثم إبحث عن الوسم التالي: <span style="color: blue;"><b>]]></b:skin> </b></span></div>
<div style="text-align: right;">
وضع قبله هذا الكود :</div>
<blockquote class="tr_bq">
.post-body *,.post-body *:after,.post-body *:before{box-sizing:initial;-webkit-box-sizing:initial;-moz-box-sizing:initial;}<br />
.list-entries{<br />
display: table;<br />
background: #FFFFFF;<br />
margin: 5px 0px 0px 0px;<br />
width: 650px;<br />
float: right;<br />
padding: 0px 0px 20px 0px;<br />
}<br />
.list-entries ul,.list-entries li{margin:0;list-style:none;padding: 0;}<br />
#feed-list-container ul li{<br />
background: #FFFFFF;<br />
line-height: normal;<br />
border: 1px solid #E2E2E2;<br />
text-align: right;<br />
width: 315px;<br />
margin: 5px 5px 0px 0px;<br />
float: right;<br />
}<br />
#feed-list-container ul li:hover{background:#fff;}<br />
#feed-list-container ul li:last-child{}<br />
.list-entries .main-title{padding:0;overflow:hidden;background-size: 22px 22px !important;border-radius: 5px;}<br />
.list-entries .main-title h4{<br />
position: relative;<br />
display: block;<br />
font-weight: normal;<br />
padding: 6px 40px;<br />
color: #fff;<br />
margin: 0!important;<br />
font-size: 25px;<br />
height: 30px;<br />
line-height: 28px;<br />
}<br />
.list-entries .title a{<br />
font-size: 12px;<br />
text-decoration: none;<br />
color: #656565;<br />
}<br />
.list-entries .title a:hover{color:#4f93c5}<br />
.summary span {}<br />
.list-entries img,.list-entries .fake-img{border:none;background-color:#333;margin:0 0 0 1em;padding:0;float:right}<br />
.list-entries .summary{<br />
overflow: hidden;<br />
color: #BBBABA;<br />
line-height: 17px;<br />
padding-top: 2px;<br />
font-size: 10px;<br />
}<br />
.list-entries .more-link{<br />
display:none;<br />
width: 316px;<br />
float: left;<br />
margin: -304px 0px 0px -13px;<br />
text-align: center;<br />
}<br />
.list-entries .more-link a{<br />
display:none;<br />
line-height: 15px;<br />
height: 15px;<br />
background: #FFFEFE;<br />
padding: 8px 20px;<br />
position: relative;<br />
color: #656565;<br />
font-size: 15px;<br />
width: 120px;<br />
margin: 6px 20px;<br />
border-radius: 5px;<br />
float: left;<br />
}<br />
.list-entries .more-link a:hover{background-color: #5A5A5A;color: #fff;}<br />
.title{<br />
line-height: 16px;<br />
padding: 4px 0px 0px 0px;<br />
}</blockquote>
<div>
<br /></div>
<div>
4- ثم قم بالبحث عن هذا الوسم: <b style="color: blue;"></body></b> ثم ضع قبله هذه الأكواد :<br />
<blockquote class="tr_bq">
<script type='text/javascript'><br />
var multiFeed = {<br />
feedsUri: [<br />
{<br />
name: "<span style="color: blue;">بلوجر</span>",<br />
url: "<span style="color: red;">https://warch-mo.blogspot.com/</span>",<br />
tag: "<span style="color: magenta;">بلوجر</span>",<br />
background:"url(<span style="color: lime;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb6IGn590E5OaGODhewURibkA-lqQxAQsvCm0dH24bnQgG1-ujN76bx-lwJ9A1u-i1_9rwD6KKFiqKntaxl-mEsBhVrwpv1WhRKeS5iCkR-4BzZCDA0gPN0s9CWRyKFE_wCo-mzNxm588/s1600/Twitter_Logo_Silhouette_16+%25281%2529.png</span>) no-repeat 618px 11px,#EF6B15",<br />
},<br />
{<br />
name: "<span style="color: blue;">حلول</span>",<br />
url: "<span style="color: red;">https://warch-mo.blogspot.com/</span>",<br />
tag: "<span style="color: magenta;">حلول</span>",<br />
background:"url(<span style="color: lime;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb6IGn590E5OaGODhewURibkA-lqQxAQsvCm0dH24bnQgG1-ujN76bx-lwJ9A1u-i1_9rwD6KKFiqKntaxl-mEsBhVrwpv1WhRKeS5iCkR-4BzZCDA0gPN0s9CWRyKFE_wCo-mzNxm588/s1600/Twitter_Logo_Silhouette_16+%25281%2529.png</span>) no-repeat 618px 11px,#EF6B15",<br />
},<br />
{<br />
name: "<span style="color: blue;">حلول</span>",<br />
url: "<span style="color: red;">https://warch-mo.blogspot.com/</span>",<br />
tag: "<span style="color: magenta;">حلول</span>",<br />
background:"url(<span style="color: lime;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb6IGn590E5OaGODhewURibkA-lqQxAQsvCm0dH24bnQgG1-ujN76bx-lwJ9A1u-i1_9rwD6KKFiqKntaxl-mEsBhVrwpv1WhRKeS5iCkR-4BzZCDA0gPN0s9CWRyKFE_wCo-mzNxm588/s1600/Twitter_Logo_Silhouette_16+%25281%2529.png</span>) no-repeat 618px 11px,#EF6B15",<br />
},<br />
],<br />
numPost: 6,<br />
showThumbnail: true,<br />
showDate: true,<br />
showSummary: true,<br />
summaryLength: 80,<br />
titleLength: "auto",<br />
thumbSize: 90,<br />
thumbSizeh: 80,<br />
containerId: "feed-list-container",<br />
readMore: {<br />
text: "مزيد من المواضيع",<br />
endParam: "?max-results=20"<br />
}<br />
};<br />
</script><br />
<script src='https://dl.dropboxusercontent.com/s/5d974tanv7zb8el/feed6%20-%20Copy.js' type='text/javascript'/></blockquote>
</div>
<div>
<span style="color: #741b47;"><u><b>تعديلات :</b></u></span></div>
<div>
غير الروابط <span style="color: red;">الحمراء</span> برابط مدونتك.</div>
<div>
الروابط <span style="color: lime;">الخضراء</span> خاصة بالايقونات يمكنك أيضا تغيرها بأيقونات أخرى من إختيارك</div>
<div>
الكلمات <span style="color: blue;">الزرقاء</span> هي عناوين الأقسام التي تظهر في الإضافة</div>
<div>
الكلمات <span style="color: magenta;">الزهرية </span>هي التسميات إحذر أن تخطئ في كتابتها يجب أن تكون كما كتبتها شاهد أداة التسميات.</div>
<div>
<br /></div>
<div>
في المرحلة الأخيرة تختار أي مكان يناسبك لتضع فيه الإضافة إما أعلى التدوينات أو أسفلها ،شاهد الصورة إنقر عليها لتكبيرها</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLML9xqqOIXghmqWFe8f7dWC6cjQlBq-pKkvD3VRZ-tb3IwENuIS6Hj8Xdd_JGLzbYJwbRC32C6WX7Vo9kU49sXugmjfY29KjX9WT8ylbMoE8DdkIWfJKF5NFx5pJqF6J4NA5172FwPuk/s1600/Capture.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLML9xqqOIXghmqWFe8f7dWC6cjQlBq-pKkvD3VRZ-tb3IwENuIS6Hj8Xdd_JGLzbYJwbRC32C6WX7Vo9kU49sXugmjfY29KjX9WT8ylbMoE8DdkIWfJKF5NFx5pJqF6J4NA5172FwPuk/s400/Capture.PNG" width="400" /></a></div>
<div>
<br /></div>
<div>
بعد أن تختار المكان المناسب . ضع فيه هذا الكود:</div>
<div>
<blockquote class="tr_bq">
<b:if cond='data:blog.url == data:blog.homepageUrl'><br />
<div id='feed-list-container'/><br />
</b:if></blockquote>
</div>
<div>
ثم قم بحفظ القالب و عاين الإضافة </div>
<div>
هذا كل ماجاء في موضوع اليوم ،أثمنى أن يعجبكم </div>
<div>
أي أستفسار لا تتردد في ترك تعليق ، في أمان الله،</div>
<div>
<br /></div>
</div>
Unknownnoreply@blogger.com1tag:blogger.com,1999:blog-8722635733075134433.post-76266563084260738972015-08-31T09:10:00.000-07:002015-08-31T09:10:41.561-07:003 طرق لوضع إعلانات أدسنس أو أي شركة وسط الموضوع بطريقة سهلة<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdAK2tlnd6ZEsDfIUxplNPnIn0KI3Za9pZ_y5SpTUW__VP2CqwjO9Hx962nKCCYkk6ReiIh-qyEDkSY4bC2gMjsq287dVSpd9tfsgeTRMgiCYZoZ5LoM5jtVvczPBvfaTS7fMBRSnk7HQ/s1600/%25D9%2588%25D8%25B6%25D8%25B9+%25D8%25A7%25D9%2584%25D8%25A5%25D8%25B9%25D9%2584%25D8%25A7%25D9%2586%25D8%25A7%25D8%25AA+%25D9%2588+%25D8%25B3%25D8%25B7+%25D8%25A7%25D9%2584%25D9%2585%25D9%2588%25D8%25B6%25D9%2588%25D8%25B9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdAK2tlnd6ZEsDfIUxplNPnIn0KI3Za9pZ_y5SpTUW__VP2CqwjO9Hx962nKCCYkk6ReiIh-qyEDkSY4bC2gMjsq287dVSpd9tfsgeTRMgiCYZoZ5LoM5jtVvczPBvfaTS7fMBRSnk7HQ/s1600/%25D9%2588%25D8%25B6%25D8%25B9+%25D8%25A7%25D9%2584%25D8%25A5%25D8%25B9%25D9%2584%25D8%25A7%25D9%2586%25D8%25A7%25D8%25AA+%25D9%2588+%25D8%25B3%25D8%25B7+%25D8%25A7%25D9%2584%25D9%2585%25D9%2588%25D8%25B6%25D9%2588%25D8%25B9.png" /></a></div>
السلام عليكم ورحمة الله تعالى و بركاته<br />
عدنا إليكم من جديد متابعينا الأوفياء ، نعتذر عن طول هذا الغياب الخارج عن إرادتنا ، المهم أحبابي في الله درس اليوم هو عبارة عن كيفية وضع الإعلانات في منتصف المواضيع ، و هذا بغية تحصيل الكثير من الأرباح ، نعلم جيدا أن كلما كانت الإعلانات منسقة كلما زادت فرص النقر عليها من قبل الزوار و في موضوع سابق ناقشنا أهم مناطق لوضع الإعلانات في مدونة بلوجر <a href="http://warch-mo.blogspot.com/2014/03/Add-Ads-Inside-Blogger.html" target="_blank">إنقر هنا للمشاهدة</a>،<br />
و كي لا أطيل عليكم نشرح طرق جعل الاعلانات في وسط المواضيع هناك عدة طرق لعمل ذلك و لكن في منصة بلوجر قليلة أو منعدمة حتى لو كانت لا تأتي بنتائج جيدة .<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ3J5yP3mCEPSha48SuGw6-RFOMQjG4DpRZJje6FGlZW3h5tZO5NUwR4kXQAZhxyhsdZONZQnJa3n9X7mS4HHkrCvnAcGKFPxJU1rqMlMBRV5svIRqEbXJEae7s5zLYyESvmZVVUMaca0/s1600/Capture.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="214" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ3J5yP3mCEPSha48SuGw6-RFOMQjG4DpRZJje6FGlZW3h5tZO5NUwR4kXQAZhxyhsdZONZQnJa3n9X7mS4HHkrCvnAcGKFPxJU1rqMlMBRV5svIRqEbXJEae7s5zLYyESvmZVVUMaca0/s320/Capture.PNG" width="320" /></a></div>
<br />
الطريقة الأولى تطرقت لها في موضوع سابق بعنوان : <span style="font-family: ge_dinar; text-align: start;"><a href="http://warch-mo.blogspot.com/2014/03/ads-center-blog.html" target="_blank"><span style="color: red;"><b>كيفية وضع الإعلانات في أي مكان وسط التدوينة</b></span></a></span><br />
عيب هذه الطريقة هي أنها ليست تلقائية ، و يلزمك عند كتابة اي موضوع ، أن تحدد المكان الذي تريد أن يظهر فيه الإعلان ، فإن نسسيت ذلك ستجد الإعلان نزل إلى أسفل الموضوع ، و العيب التاني هي أن عند ما تغير القالب لن تعمل الطريقة حتى لو قمت بتعديل الإعلانات في القالب لإنه يجب عليك تحديد مكان الإعلان في جميع المواضيع و هذا شاق جدا.<br />
<br />
الطريقة الثانية<br />
الذهاب للوحة تحكم بلوجر ثم القالب ثم نضغظ تحرير html.<br />
ننقر وسط الأكواد و نضغظ على الزرين ctrl و f دفعة واحدة<br />
نبحث عن هذا الكود :<br />
<blockquote class="tr_bq" style="text-align: center;">
<data:post.body></blockquote>
<div style="text-align: right;">
ستجد أكثر من واحد الثالت هو المقصود</div>
<div style="text-align: right;">
و نستبدله بهذا الكود:</div>
<blockquote class="tr_bq" style="text-align: center;">
<div expr:id='&quot;post1&quot; + data:post.id'/><br /><div class='googlepublisherads' style='margin:20px 0'><br /><div class='separator' style='clear: both; text-align: center; '><br /><span style="color: red;">ضع كود الإعلان هنا</span></div><br /></div><br /><div expr:id='&quot;post2&quot; + data:post.id'><data:post.body/></div><br /><script type='text/javascript'><br />var obj0=document.getElementById(&quot;post1<data:post.id/>&quot;);<br />var obj1=document.getElementById(&quot;post2<data:post.id/>&quot;);<br />var s=obj1.innerHTML;<br />var t=s.substr(0,s.length/2);<br />var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;);<br />if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}<br /></script></blockquote>
<div style="text-align: right;">
إستبدل ما باللون الأحمر بشفرة الإعلان بعد تحويلها لتلائم أكواد html.</div>
<div style="text-align: right;">
ثم قم بحفظ القالب و عاين أي موضوع و ستجد الإعلانات في منتصف الموضوع.</div>
<div style="text-align: right;">
في حالة لم تعمل معك الطريقة فيمكنك تطبيق الطريقة الثالثة</div>
<div style="text-align: right;">
الطريقة الثالثة</div>
<div style="text-align: right;">
هي مثلها مثل الطريقة الثانية كل ما عليك هو تغير الكود الذي ألصقته في الطريقة الثانية بهذا الكود :</div>
<blockquote class="tr_bq" style="text-align: center;">
<div id='jobmiddlenew'><br /><data:post.body/><br /> </div><br /><b:if cond='data:blog.pageType == &quot;item&quot;'><br /><style><br />#addcodemiddle{display: none;}<br /></style><br /><div id='addcodemiddle'><br /><br /><span style="color: red;">ضع كود الإعلان هنا</span> </div> <br /><script type='text/javascript'><br />var str1=document.getElementById(&quot;jobmiddlenew&quot;).innerHTML;<br />var str2=str1.length;<br />var str3=str2/2;<br />var substr = str1.substring(str3, str2);<br />var n = substr.search(&quot;&lt;br&gt;&quot;);<br />if(n&lt;0)<br />{<br />n = substr.indexOf('.');<br />if(n&lt;0)<br />{<br />n=0;<br />}<br />var firsthalf = str1.substring(0, str3+n+1);<br />var secondhalf = str1.substring(str3+n+1, str2);<br />}<br />else<br />{<br />var firsthalf = str1.substring(0, str3+n+4);<br />var secondhalf = str1.substring(str3+n+4, str2);<br />}<br />var addcode=&quot;<center>&quot;+document.getElementById(&quot;addcodemiddle&quot;).innerHTML+&quot;</center><br/>&quot;;<br />var newbody=firsthalf+addcode+secondhalf;<br />var strnew=document.getElementsByClassName(&quot;post-body entry-content&quot;);<br />strnew[0].innerHTML=newbody;<br />document.getElementById(&quot;addcodemiddle&quot;).innerHTML=&quot;&quot;; <br /></script><br /> </b:if></blockquote>
<div style="text-align: right;">
ولا تنسى تغير ما بالأحمر بكود الإعلان بعد تحويله,</div>
<div style="text-align: right;">
أتمنى أن تستفيدو من الموضوع أي إستفسار أنا في الخدمة</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-24808902631193440222015-05-10T03:54:00.002-07:002015-05-11T02:36:54.335-07:00إضافة صندوق إعجابات الفيسبوك بعد التحديث الجديد<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2Wt-83G0xKaBZrysYf3TBAQVuGvwOcTRVyq4JFkCjYEvCbwrfkWtm2QWFo2RJHINcsiOECeKFgdX88zSADcHf8kXuhYnFHIT1X-L1uDV_vo5gnCOcDvsTEpmy8PTS40fEl3LSAn-TR5E/s1600/Social+Plugins.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="298" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2Wt-83G0xKaBZrysYf3TBAQVuGvwOcTRVyq4JFkCjYEvCbwrfkWtm2QWFo2RJHINcsiOECeKFgdX88zSADcHf8kXuhYnFHIT1X-L1uDV_vo5gnCOcDvsTEpmy8PTS40fEl3LSAn-TR5E/s400/Social+Plugins.png" width="400" /></a></div>
<br />
السلام عليكم ورحمة الله و بركاته<br />
تشكل مواقع التواصل الإجتماعي، فضاء واسع لترويج المنتوجات على الأنترنيت، سواء مواقع إخبارية أو تجارية أو شخصية أو غير ذلك، فمن خلال إنشاء صفحة تمثل مشروعك على الفيسبوك ، فأنت في هذه الحالة في طور إنشاء قاعدة جماهرية مهتمة بنشاطك على الأنترنيت، و منها سوف تشرع بإستقطاب عدد مهم من الزوار لموقعك.<br />
أما بالنسبة لموضوعنا اليوم فهو شرح طريقة تركيب صندوق الإعجابات الخاص بصفحتك على الفيسبوك على واجهة مدونتك أو موقعك، لقد طرحت في موضوع سابق عن كيفية وضع صندوق إعجابات الفيس بوك على بلوجر شاهد <a href="http://warch-mo.blogspot.com/2014/02/blog-post_4517.html">هنا</a> و لكن مع التحديث الجديد للخاصية أصبح من الضروري إعادة شرحها ، و أهم ما يميز هذا الصندوق الجديد هو ظهور غلاف الصفحة و صورتها الشخصية مع ظهور زر الإعجاب و زر المشاركة الذي يمكن زوار موقع من مشاركة صفحة مع أصدقائهم.<br />
<br />
<span style="color: blue;">طريقة التركيب:</span><br />
1- تذهب إلى لوحة التحكم بلوجر ثم التخطيط <br />
2- تنقر إضافة أداة ثم تختار أداة html javascript<br />
3- تلصق الأكواد التالية داخل الإطار ثم تقوم بالحفظ.<br />
<div style="text-align: center;">
<blockquote class="tr_bq">
<div id="fb-root"></div><br />
<script>(function(d, s, id) {<br />
var js, fjs = d.getElementsByTagName(s)[0];<br />
if (d.getElementById(id)) return;<br />
js = d.createElement(s); js.id = id;<br />
js.src = "//connect.facebook.net/ar_AR/sdk.js#xfbml=1&version=v2.3&appId=567405696684175";<br />
fjs.parentNode.insertBefore(js, fjs);<br />
}(document, 'script', 'facebook-jssdk'));</script><br />
<div class="fb-page" data-href="<span style="color: #cc0000;">https://www.facebook.com/warch.mo</span>"<br />
data-width="<span style="color: #cc0000;">325</span>" data-hide-cover="<span style="color: blue;">false</span>" data-show-facepile="<span style="color: #38761d;">true</span>"<br />
data-show-posts="<span style="color: #b45f06;">false</span>"></div></blockquote>
</div>
<div>
<span style="color: #351c75;">بعض التعديلات على الكود:</span></div>
غير الرابط الأحمر برابط صفحتك على الفيس بوك.<br />
<span style="color: #cc0000; text-align: center;">325</span> هو عرض الإضافة و يمكنك تعديله حسب ما يناسبك.<br />
<span style="color: #b45f06; text-align: center;">false</span> و تعني منع ظهور المنشورات المتواجدة بصفحتك ، إن أردت أن تظهر غيرها بكلمة true.<br />
<span style="color: #38761d; text-align: center;">true</span> وتعني قبول ظهور أيقونات معجبي صفحتك على الإضافة، و كذلك إذا اردت عدم إظهارهم غيرها بكلمة false.<br />
<span style="color: blue; text-align: center;">false</span> و تعني منع إظهار غلاف صفحتك ، إن أردت أن لا يظهر غيرها بكلمة true.<br />
<div>
موضوعنا اليوم أشرف على الأنتهاء، أي إستفسار أنا في الخدمة فقط إترك تعليق، دمتم بود في أمان الله</div>
</div>
Unknownnoreply@blogger.com1tag:blogger.com,1999:blog-8722635733075134433.post-84819616592582288612015-04-28T12:24:00.002-07:002015-04-28T12:24:57.292-07:00شرح لوحة الكتابة مع كتابة أول تدوينة على المدونة<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzoQ_auVhzKr-db9IB25XL3Tr6RJncsVRyCa_xqO8jr4vcLmISTuJqPihC4mT_bWII7pBEDlVEV0OrmVN7Wm_Y3B46Z7TqbXs6PbYVn_2ZX1tBOZifRItG4WcbTplD_wDb3u-sXWUpNPM/s1600/%D9%83%D8%AA%D8%A7%D8%A8%D8%A9+%D8%A3%D9%88%D9%84+%D8%AA%D8%AF%D9%88%D9%8A%D9%86%D8%A9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzoQ_auVhzKr-db9IB25XL3Tr6RJncsVRyCa_xqO8jr4vcLmISTuJqPihC4mT_bWII7pBEDlVEV0OrmVN7Wm_Y3B46Z7TqbXs6PbYVn_2ZX1tBOZifRItG4WcbTplD_wDb3u-sXWUpNPM/s1600/%D9%83%D8%AA%D8%A7%D8%A8%D8%A9+%D8%A3%D9%88%D9%84+%D8%AA%D8%AF%D9%88%D9%8A%D9%86%D8%A9.png" /></a></div>
السلام عليكم و رحمة الله تعالى و بركاته<br />
بعدما رأينا في دروسنا المتسلسلة ، عن طريقة إنشاء مدونة و أهم التعديلات التي تهم مظهر المدونة وصولا إلى هذه المرحلة و التي تعتبر بذاتها نقطة الإنطلاق في التدوين ، خلال هذه التدوينة سوف نلقي نظرة على أهم الأدوات و الخاصيات التي تحتويها لوحة الكتابة و في نفس الوقت سوف نعمل على كتابة موضوع من أجي التجربة ,,, و لقد قمت بتصويرهذا الفيديو من أجل تسهيل إستيعاب الشرح ، و إن وجدتم أي مشكل ، إتركوا إستفساركم في تعليق ، و سوف أكون سعيد بالإجابة عليه.<br />
<div style="text-align: center;">
<span style="color: #0b5394;">فرجة ممتعة</span> <b><span style="color: red;">^_^</span></b></div>
<div style="text-align: center;">
<br /></div>
<iframe allowfullscreen="" frameborder="0" height="390" src="https://www.youtube.com/embed/u8nYhCEUgL0" width="640"></iframe><br />
<div style="text-align: center;">
<div style="text-align: right;">
أتمنى أن أكون قد توفقت في الشرح، إلى موضوع جديد إن شاء الله ، دمتم في أمان الله.</div>
</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-88124823184591355172015-04-24T11:04:00.000-07:002015-04-24T14:15:11.951-07:00كيفية إنشاء الصفحات الثابتة في المدونة بلوجر للمبتدئين [نموذج صفحة سياسة الخصوصية] <div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiewQxxR9u8BNpJdp2QNLBD85MnDgJPg698plIJty05sLw6RONe1ke020tty1emw9K-Q7Bobjb2wETe0uYpvOIXOVjqTG5KUEcC3FGFzFUaYf18eHhpP4QL8jRG8BA6kvgUAc8BsySk5no/s1600/%D8%B5%D9%81%D8%AD%D8%A9+%D8%A5%D8%AA%D8%B5%D9%84+%D8%A8%D9%86%D8%A7+%D8%8C+%D8%B5%D9%81%D8%AD%D8%A9+%D8%B3%D9%8A%D8%A7%D8%B3%D8%A9+%D8%A7%D9%84%D8%AE%D8%B5%D9%88%D8%B5%D9%8A%D8%A9+%D8%8C+%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D8%B5%D9%81%D8%AD%D8%A9+%D8%AB%D8%A7%D8%A8%D8%AA%D8%A9+%D8%B9%D9%84%D9%89+%D9%85%D8%AF%D9%88%D9%86%D8%A9+%D8%A8%D9%84%D9%88%D8%AC%D8%B1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiewQxxR9u8BNpJdp2QNLBD85MnDgJPg698plIJty05sLw6RONe1ke020tty1emw9K-Q7Bobjb2wETe0uYpvOIXOVjqTG5KUEcC3FGFzFUaYf18eHhpP4QL8jRG8BA6kvgUAc8BsySk5no/s1600/%D8%B5%D9%81%D8%AD%D8%A9+%D8%A5%D8%AA%D8%B5%D9%84+%D8%A8%D9%86%D8%A7+%D8%8C+%D8%B5%D9%81%D8%AD%D8%A9+%D8%B3%D9%8A%D8%A7%D8%B3%D8%A9+%D8%A7%D9%84%D8%AE%D8%B5%D9%88%D8%B5%D9%8A%D8%A9+%D8%8C+%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D8%B5%D9%81%D8%AD%D8%A9+%D8%AB%D8%A7%D8%A8%D8%AA%D8%A9+%D8%B9%D9%84%D9%89+%D9%85%D8%AF%D9%88%D9%86%D8%A9+%D8%A8%D9%84%D9%88%D8%AC%D8%B1.png" /></a></div>
السلام عليكم و رحمة الله تعالى و بركاته.<br />
من الإستحالة أن تجد موقع ويب أو مدونة لا تحتوي على صفحات تابثة أو ما يسمى بـ "<b>static-pages</b>" ، فالدور الذي تقوم به هذه الصفحات مهم جدا و لا يمكن لأي موقع إحترافي الإستغناء عنها، و من أهم الأغراض التي قد نحتاجها لها مثلا:<br />
<span style="color: red;"><b><span style="font-size: large;">1-</span></b> </span>صفحة سياسة الخصوصية "<b>Privacy-Policy</b>"<b> </b>و من خلال هذه الصفحة تبين لزوار و متصفحي و مدونتك مدى حفاظك على بيانتهم الشخصية والأطراف التي تعتمدها في موقعك مثل شركات الإعلانات و غيرها.<br />
<span style="font-size: large;"><span style="color: red; font-weight: bold;">2-</span><b> </b></span>صفحة إتصل بنا "<b>contact-us</b>"<b> </b>و التي من خلالها يمكن للزوار التواصل معك عبر البريد الإلكتروني كلما تطلب الأمر ذلك.<br />
<b><span style="color: red; font-size: large;">3-</span></b> صفحة الفهرس أو خريطة الموقع "<b>index</b>" ou "<b>site map</b>" وفي هذه الأخيرة يمكن للزائر أن يجد قائمة الأقسام و المواضيع التي بالمدونة و يسهل عليه معرفة نوع المحتوى الذي يوفره موقعك أو مدونتك.<br />
<br />
هناك عدة إستخدامات أخرى للصفحات الثابتة مثل إضافة بعد الأدوات التي يمكن للزوار إستخدمها مثل الفتوشوب أونلاين أو صفحة خاصة بالقرآن الكريم أو صفحة ركن الأسئلة أو صفحة عن المدونة أو صفحة تعريفية للكاتب و الكثير ...<br />
<br />
أما درسنا اليوم سنلقي نظرة سريعة عن كيفية إنشاء هذه الصفحات ، متخذين من صفحة سياسة الخصوصية مثال للشرح. شاهد الفيديو:<br />
<div style="text-align: center;">
<iframe allowfullscreen="" frameborder="0" height="390" src="https://www.youtube.com/embed/BGf5PPtQ6l8" width="640"></iframe><br /></div>
أتمنى أن تكونوا قد إستفدتم من الشرح ، أي إستفسار فقط إترك تعليق</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-24457618544125460252015-04-23T14:11:00.000-07:002016-05-11T15:46:22.085-07:00كيفية وضع أو تغير شعار "logo" مدونة بلوجر <div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeZfHi14H6BljpaexMbbT9gXk5K1C9lt79eiFVOHitH-Ix0jT1-wG8Cr4vQvBpgrbHE6e5XRPbF_mfbg1rcfIrX_QiAMj1OsaZt7dVZC2MsOFvRj4O-0qv-3plzoW_YG4hcLIr25QAYEA/s1600/VFFGF.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeZfHi14H6BljpaexMbbT9gXk5K1C9lt79eiFVOHitH-Ix0jT1-wG8Cr4vQvBpgrbHE6e5XRPbF_mfbg1rcfIrX_QiAMj1OsaZt7dVZC2MsOFvRj4O-0qv-3plzoW_YG4hcLIr25QAYEA/s1600/VFFGF.png" /></a></div>
السلام عليكم و رحمة الله تعالى و بركاته<br />
متابعي ورشة مدون الأوفياء ، نستأنف دروسنا في هذه الدورة التي نشرح فيها كل ما يلزم المبتدئين لإكمال تدشين مدونتهم و السير على خطى المدونين الكبار على مستوى العالم الإفتراضي، و في شرح هذا اليوم سوف نتطرق واحد من أهم خصائص المدونة أو الموقع و الذي هو الشعار أو ما يسمى اللوجو logo ، فهذا الإخير يجعل مدونتك مميزة عن أي مدونة أو موقع ، و الزوار أو ما تقع عينه عليه أثناء الدخول إلى مدونتك ، و بالتالي يجب عليك أن تجعل لها شعار ملائم و متناسق بشكل جيد، لدى في هذا الفيديو قمت بشرح طريقتين لتغير الشعار أو ضع شعار جديد لأول مرة في القالب. أترككم مع الشرح وأي إستفسار إتركه في تعليق.<br />
<div style="text-align: center;">
فرجة ممتعة ^_^</div>
<div style="text-align: center;">
<iframe allowfullscreen="" frameborder="0" height="390" src="https://www.youtube.com/embed/j9JuyecSzzQ?list=PLmocOHSHra_xrx_yGCE2h17d83_9MNxMw" width="640"></iframe><br /></div>
<div style="text-align: center;">
الرابط المستعمل لرفع صورة الشعار:</div>
<div style="text-align: center;">
<span style="color: blue;"><b><a href="http://www.up-00.com/" target="_blank">up-00</a></b></span></div>
</div>
Unknownnoreply@blogger.com3tag:blogger.com,1999:blog-8722635733075134433.post-54239632207875870792015-04-22T10:54:00.000-07:002015-04-23T07:52:52.640-07:00شرح مكونات و خصائص منصة بلوجر للمبتدئين<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWVyPiaFpAYnmIhHNsRBbzyupSEF7m25OtMUuBhGk-njQ5oKg8ZQLzvhqrkjvK4ZS-OUwaYbfTrxj05fNVD4L7AlAOAOSfVGrtFNr73Zlk04s17SuN5P3je4y9mZTCJ7wx_AtAtaEiEgE/s1600/Explain-the-blogger-platform.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWVyPiaFpAYnmIhHNsRBbzyupSEF7m25OtMUuBhGk-njQ5oKg8ZQLzvhqrkjvK4ZS-OUwaYbfTrxj05fNVD4L7AlAOAOSfVGrtFNr73Zlk04s17SuN5P3je4y9mZTCJ7wx_AtAtaEiEgE/s1600/Explain-the-blogger-platform.png" /></a></div>
السلام عليكم ورحمة الله وبركاته<br />
متابعي و رشة مدون الأوفياء، أتمنى أن تكون في أتم الصحة و العافية ، بعدما رأينا طريقة إنشاء مدونة على منصة بلوجر و كيفية الحصول على قالب بلوجر لنرفعه عليها شاهد الدرس من <a href="http://warch-mo.blogspot.com/2015/04/How-to-create-a-blog-on-blogger.html" target="_blank"><b><span style="font-size: large;">هنا</span></b></a>.<br />
قبل أن أبدأ في شرح طريقة التعديل على القالب و غيرها من الأمور التي تنتظرنا لاحقا من أجل إكمال نشأة المدونة ، أحببت أن أقدم لكم وصف و شرح نظري سريع على جميع أدوات المنصة و التي من خلالها سنتمكن من عمل العديد من الأمور. لهذا أحبابي في الله قمت بتصوير هذا الفيديو أتمنى لكم فرجة ممتعة<br />
<iframe allowfullscreen="" frameborder="0" height="390" src="https://www.youtube.com/embed/Kra1KkFNtUQ" width="640"></iframe><br />
<br />
أتمنى أن تستفيدوا من الشرح أي إستفسار أنا في الخدمة، فقط إترك تعليق و سأكون سعيدا بمساعدة الجميع دمتم بود في أمان الله،</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-9410627180813443062015-04-17T13:03:00.001-07:002015-04-17T13:03:41.438-07:00كيفية إنشاء أول مدونة لنا على بلوجر مع رفع قالب عليها<div dir="rtl" style="text-align: right;" trbidi="on">
<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxNXnPvOh0qld8Vr9UAFMX6Hs5T9nZ9jESMkk4hr2e3OaqgdHSw14bqBJU8aMzvxhIQjaZVrqOecka6RveqT9Red2nndzj98MkjTqb_BFzNuAE7-ldp7x8JP6MxVO83c8w2K04-WJyip8/s1600/%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D9%85%D8%AF%D9%88%D9%86%D8%A9+%D8%A8%D9%84%D9%88%D8%AC%D8%B1%D8%8C+%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D9%85%D9%88%D9%82%D8%B9%D9%83.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxNXnPvOh0qld8Vr9UAFMX6Hs5T9nZ9jESMkk4hr2e3OaqgdHSw14bqBJU8aMzvxhIQjaZVrqOecka6RveqT9Red2nndzj98MkjTqb_BFzNuAE7-ldp7x8JP6MxVO83c8w2K04-WJyip8/s1600/%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D9%85%D8%AF%D9%88%D9%86%D8%A9+%D8%A8%D9%84%D9%88%D8%AC%D8%B1%D8%8C+%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D9%85%D9%88%D9%82%D8%B9%D9%83.png" /></a></div>
السلام عليكم<br />
مرحبا بك على <a href="http://www.warch-mo.blogspot.com/" target="_blank">ورشة مدون</a> ، التي توفر لك كل ما تحتاجه لتكون مدونا ناجحا بإمتياز نستأنف دروسنا في ما يخص التدوين ، درسنا اليوم هو طريقة إنشاء أو مدونة على منصة <b>Blogger</b> ، و رفع قالب خاص بنا عليها ، سبق و ذكرنا أن من الضروري أن تتوفر على حساب جيمال ، إن كنت لا تتوفر عليه فأنصحك بمشاهدة هذا الدرس السابق من <span style="color: red;"><b><a href="http://www.warch-mo.blogspot.com/2015/04/gmail.html" target="_blank">هنا</a></b></span><br />
شاهد طريقة إنشاء مدونة بلوجر جديد بالصورة و الصورة ، أتمنى لك فرجة ممتعة ^_^<br />
<br />
<iframe allowfullscreen="" frameborder="0" height="390" src="https://www.youtube.com/embed/d0mM07z0Id4" width="640"></iframe><br />
<div style="text-align: center;">
الرابط المستعمل في الشرح: <span style="color: red;"><b><a href="https://www.blogger.com/" target="_blank">Blogger</a></b></span></div>
</div>
<div style="text-align: center;">
تحميل القالب المستعمل في الشرح: <span style="color: red;"><b><a href="http://www.mediafire.com/download/ds04wdyilp2k3gs/%D9%82%D8%A7%D9%84%D8%A8+%D8%A7%D9%84%D9%85%D8%B3%D8%A7%D8%B9%D8%AF+%D8%A7%D9%84%D8%B9%D8%B1%D8%A8%D9%8A.xml" target="_blank">من هنا</a></b></span></div>
<div style="text-align: center;">
أي إستفسار إترك تعليق و سأكون سعيدا بالإجابة عليه، دمتم بود إلى دلرس قادم إنشاء الله. </div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-19156666676551636582015-04-04T05:56:00.002-07:002015-04-04T05:56:40.582-07:00كيفية إنشاء حساب جيميل gmail للمبتدئين<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7zHd1iKJSW_Ld9UXNqoXC6xTBq6J0PD_DVP1UYpX-VGPihx3H2zXFJN0Jd_I1kCkgYxmNGnQ0LB36aLNUNrT9BHEcfQXc_wqNYSt0hXBRh4sRMJDakeoeU9zhMsckziNzQSRIgtFf_zE/s1600/%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D8%AD%D8%B3%D8%A7%D8%A8+%D8%AC%D9%8A%D9%85%D9%84.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7zHd1iKJSW_Ld9UXNqoXC6xTBq6J0PD_DVP1UYpX-VGPihx3H2zXFJN0Jd_I1kCkgYxmNGnQ0LB36aLNUNrT9BHEcfQXc_wqNYSt0hXBRh4sRMJDakeoeU9zhMsckziNzQSRIgtFf_zE/s1600/%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D8%AD%D8%B3%D8%A7%D8%A8+%D8%AC%D9%8A%D9%85%D9%84.png" /></a></div>
السلام عليكم و رحمة الله و بركاته.<br />
بعد أن قمنا بدراسة أهمية التدوين و أنسب منصة لمزاولة هذا الأخير، مع أهم الأسس التي يجب مراعاتها للنجاح في المجال الذي ندون ضمنه، يمكنك الإطلاع على جميع المواضيع من خلال قسم <a href="http://goo.gl/m6xFkR" target="_blank"><span style="color: red;">التدوين</span> </a> ، و في هذه المشاركة البسيطة سوف نرى أو خطوة قبل إنشاء المدونة و التي هي إنشاء حساب جيميل الذي يوفر لنا العديد من الخدمات و التي من ضمنها البلوجر، كل ما عليك هو التوجه إلى هذا الرابط : <span style="color: blue;"><a href="http://gmail.com/" target="_blank">gmail</a></span> ثم ملء الإسثمارة بكل سهولة، يمكنك شاهد الفيديو لتعرف أكثر.<br />
<div style="text-align: center;">
<br /><iframe allowfullscreen="" frameborder="0" height="360" src="https://www.youtube.com/embed/t8j0yG0jvqA?feature=player_detailpage" width="640"></iframe></div>
<div style="text-align: center;">
دمتم بود في أمان الله.</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-73129714830734634352015-02-14T05:33:00.001-08:002015-02-14T05:33:27.752-08:00إضافة صندوق إضافات مزدوج في السيدبار بالمدونة<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5ZZGQv36CPJHkyLlVD9L0Sb2wvyGKtgtbyPXqQoMSMRdDXIlH9ar1XR6ZAYf-V4Cv9a8VFHftnrdwbMIHgExtsVCwARUiw62A-Pdvr2ca82ae3lSZ-rAUwnca9gTaCmV0HihlvyXUj6o/s1600/Tabbed-Sidebar-for-Blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5ZZGQv36CPJHkyLlVD9L0Sb2wvyGKtgtbyPXqQoMSMRdDXIlH9ar1XR6ZAYf-V4Cv9a8VFHftnrdwbMIHgExtsVCwARUiw62A-Pdvr2ca82ae3lSZ-rAUwnca9gTaCmV0HihlvyXUj6o/s1600/Tabbed-Sidebar-for-Blogger.png" /></a></div>
السلام عليكم ور حمة الله و بركاته.<br />
مرحبا بكم مجددا، متابعين الكرام كما عودناكم دائما بالجديد والحصري والمفيد على ورشة مدون، التي تهتم بكل ما يخص المدونين على منصة بلوجر، و درس اليوم هو كيفية إضافة آداة مزدوجة في السيدبار و هي على شكل قائمة مقسمة لتحتوي ثلاث نوافذ، في كل نافدة يمكنك وضع إضافة معينة ، وهذه الإضافة جميلة جدا وإحترافية و تهم بالخصوص أصحاب المدونات التي تشكو من قلة المساحات في واجهة المواقع، بحيث عوض وضع ثلات إضافات متفرقة التي ستأخد مساحة كبيرة من المدونة ، تقوم بوضع هذه الأخيرة التي تمكنك من الإنتقال بين الإضافات بسلاسة و خفة.<br />
<div style="text-align: center;">
<b><span style="color: #e69138;">يمكنك معاينتها في مدونتنا السيدبار على يسارك</span></b></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
الآن طريقة تركيب الإضافة.</div>
<ol style="text-align: right;">
<li>نذهب للوحة التحكم بلوجر ثم القالب نقوم بأخد نسخة إحتياطية للقالب تحسبا لأي خطأ.</li>
<li>بعدها نقوم بتحرير HTML ثم ننقر وسط الأكواد و نبحث بالإستعانة بالزرين عن (CTRL+F) عن الوسم <span style="color: blue;"><b>]]></b:skin></b></span></li>
<li>بعد إيجاده ضع الكود التالي فوقه مباشرة.</li>
</ol>
<blockquote class="tr_bq">
<div style="text-align: center;">
/* Tab Widget By warch-mo */<br />.tabbedviewsection {<br />background: #f8f8f8;<br />text-transform: uppercase;<br />float: left;<br />width: 99%;<br />}<br />.tabbed-widget {<br />list-style: none;<br />list-style-type: none;<br />margin: 0 0 10px 0;<br />padding: 0;<br />}<br />.tabbed-widget li {<br />list-style: none;<br />list-style-type: none;<br />padding: 0;<br />float: right;<br />border-left: 2px solid #fff;<br />}<br />.tabbed-widget li a {<br />color: #000;<br />display: block;<br />padding-right: 14px;<br />padding-left: 14px;<br />font-size: 13px;<br />padding-top: 14px;<br />padding-bottom: 14px;<br />text-decoration: none;<br />border-top-left-radius: 5px;<br />border-top-right-radius: 5px;<br />}<br />.tabbed-widget-content {<br />}<br />.tabbedviewsection {<br />margin-top: 10px;<br />margin-bottom: 10px;<br />}<br />.tags_tab {<br />text-align: center;<br />}<br />.about_tab {<br />text-align: center;<br />}<br />li.laster {<br />border: 0px;<br />text-align: center;<br />}<br />.blog-mobile-link {<br />display: none;<br />}<br />.tabbed-widget li a {<br />padding-left: 20px;<br />padding-right: 20px;<br />}<br />/* .tabbed-widget {<br />height: 51px;<br />}*/ <br />.tw-authors {<br />width: 570px;<br />}<br />.tabbedviewsection h2 {<br />display: none;<br />}<br />.tabbed-widget li a.tabbed-widget-current {<br />padding-bottom: 20px;<br />margin-top: -10px;<br />background: #f8f8f8;<br />color: #444;<br />text-decoration: none;<br />border-top: 5px solid #24AAE9;<br />font-size: 14px;<br />text-transform: capitalize;<br />}<br />.tabbed-widget li a {<br />background: #24AAE9;<br />}</div>
</blockquote>
<div style="text-align: right;">
بعد ذلك نقوم بالبحث عن أحد الأكواد التالية:</div>
<blockquote class="tr_bq">
<div style="text-align: center;">
<div id='sidebar-wrapper'></div>
<div style="text-align: center;">
أو<br /><div class='sidebar-wrapper'><br />أو<br /><div class='sidebar'><br />أو<br /><div id='sidebar'></div>
</blockquote>
<div style="text-align: center;">
</div>
<div style="text-align: center;">
<b><span style="color: red;">ملاحظة :</span></b> قد لا تجد أي أحد هذه الأكواد لأن تصاميم القوالب تختلف و لكن يجب عليك البحث عن معرف السيدبار بقالبك، المهم إن واجهت هذا المشكل إترك تعليق به رابط مدونتك لأساعدك.</div>
<div style="text-align: right;">
</div>
<div style="text-align: right;">
بعد أن تجد المعرف الخاص بالسيدبار لديك قم بوضع هذا الكود مباشرة بعده.</div>
<div style="text-align: center;">
<blockquote class="tr_bq">
<!-- Tab Widget [start] by warch-mo--><div class='tabbedviewsection'><script type='text/javascript'> jQuery(document).ready(function($){ $(&quot;.tabbed-widget-content-widget-themater_tabs-1432447472-id&quot;).hide(); $(&quot;ul.tabbed-widget-widget-themater_tabs-1432447472-id li:first a&quot;).addClass(&quot;tabbed-widget-current&quot;).show(); $(&quot;.tabbed-widget-content-widget-themater_tabs-1432447472-id:first&quot;).show(); $(&quot;ul.tabbed-widget-widget-themater_tabs-1432447472-id li a&quot;).click(function() { $(&quot;ul.tabbed-widget-widget-themater_tabs-1432447472-id li a&quot;).removeClass(&quot;tabbed-widget-current a&quot;); $(this).addClass(&quot;tabbed-widget-current&quot;); $(&quot;.tabbed-widget-content-widget-themater_tabs-1432447472-id&quot;).hide(); var activeTab = $(this).attr(&quot;href&quot;); $(activeTab).fadeIn(); return false; }); }); </script><ul class='tabbed-widget tabbed-widget-widget-themater_tabs-1432447472-id'> <li class='about_tab'><a href='#widget-themater_tabs-1432447472-id1'><span style="color: red;">مواضيع شائعة</span></a></li> <li class='tags_tab'><a href='#widget-themater_tabs-1432447472-id2'><span style="color: red;">تعليقات الزوار</span></a></li> <li class='laster'><a href='#widget-themater_tabs-1432447472-id3'><span style="color: red;">الأرشيف</span></a></li></ul><!-- Tab Widget 1 --><div class='tabbed-widget-content tabbed-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id1'><b:section class='sidebar' id='sidebartab1' preferred='yes'> </b:section> </div> <!-- Tab Widget 2 --> <div class='tabbed-widget-content tabbed-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id2'><b:section class='sidebar' id='sidebartab2' preferred='yes'> </b:section> </div><br /><!-- Tab Widget 3 --><div class='-content tabbed-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id3'><b:section class='sidebar' id='sidebartab3' preferred='yes'></b:section> </div></div><!-- Tab Widget [endt] --></blockquote>
يمكنك تغير الكلمات باللون الأحمر بما يناسبك</div>
<div style="text-align: center;">
أما طريقة إستخدام الإضافة فهي سهلة عند الذهاب لصفحة التخطيط سوف تجدها كما في الصورة</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVCdH3IikgK8uD9WB9FYd2-ACZkgUrD1kX5v1XjG5AsDjhrrsxe8Qnoe3MSIaC2c9NeHRhyYimqFuy-UFQwxiGbVUky5yVv0uOdR8CAx5fcsAOROPmCT0pqK7mjgbvFqOACd7R-GKUBeY/s1600/Tabbed-Sidebar-for-Blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVCdH3IikgK8uD9WB9FYd2-ACZkgUrD1kX5v1XjG5AsDjhrrsxe8Qnoe3MSIaC2c9NeHRhyYimqFuy-UFQwxiGbVUky5yVv0uOdR8CAx5fcsAOROPmCT0pqK7mjgbvFqOACd7R-GKUBeY/s1600/Tabbed-Sidebar-for-Blogger.png" /></a></div>
<div style="text-align: center;">
كل خانة يمكنك أن تضع بها أداة مهما كان نوعها، المهم أتمنى أن يعجبكم الدرس و أن تستفيدوا منه أي إستفسار أنا في الخدمة،</div>
<div style="text-align: center;">
دمتم بود في أمان الله.</div>
</div>
Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-8722635733075134433.post-18434656724628974952015-02-01T10:54:00.001-08:002015-02-01T11:16:40.569-08:00إضافة أزرار التحميل و المعاينة للبلوجر<div dir="rtl" style="text-align: right;" trbidi="on">
<div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTSJfLCd0kPUruVAnnL5ApbLZPVJ5C8PZ3lTYSdvrHLH39ZXOs2hy8ADrjJnpl5Bpw7afRmLKEx6_L1QP0HVlLAnHIh2HqhExpmO1pZyN3uqScCYVXDMjcWCHTb2a42NELNSLNx8cmCWg/s1600/%D8%A3%D8%B2%D8%B1%D8%A7%D8%B1+%D8%A7%D9%84%D8%AA%D8%AD%D9%85%D9%8A%D9%84+%D9%84%D9%84%D8%A8%D9%84%D9%88%D8%AC%D8%B1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTSJfLCd0kPUruVAnnL5ApbLZPVJ5C8PZ3lTYSdvrHLH39ZXOs2hy8ADrjJnpl5Bpw7afRmLKEx6_L1QP0HVlLAnHIh2HqhExpmO1pZyN3uqScCYVXDMjcWCHTb2a42NELNSLNx8cmCWg/s1600/%D8%A3%D8%B2%D8%B1%D8%A7%D8%B1+%D8%A7%D9%84%D8%AA%D8%AD%D9%85%D9%8A%D9%84+%D9%84%D9%84%D8%A8%D9%84%D9%88%D8%AC%D8%B1.png" /></a></div>
السلام عليكم ورحمة الله وبركاته<br />
متابعي ورشة مدون الأوفياء، أعتذر عن مدة غيابي التي كانت بسبب بعض المشاكل التقنية الخارجة عن إرادتي، المهم كما عودتكم دائما بجديد المواضيع ، لقد ذكرت سابقا في إحدى التدوينات كيفية إنشاء أزرار التحميل والمعاينة و هذا الموضوع هو في نفس السياق إلا أن هذه الأزرار هذه المرة بها أيقونات تدل على غرضها مع أنها أكثر إحترافية و ستزيد من مدى جمالية مدونتك، و لتركيبها ما عليك إلا متابعة الشرح.<br />
<div style="text-align: center;">
<a href="http://demo-mo.blogspot.com/2014/12/blog-post.html" rel="nofollow" target="_blank"><span style="color: orange;"><span style="font-size: large;"><b>((((المعاينة الحية )))) </b></span></span></a></div>
<ol style="text-align: right;">
<li>أولا نذهب للوحة التحكم بلوجر ثم القالب.</li>
<li>نقوم بأخذ نسخة إحطياطية دائما لتفادي أي غلط بالرغم من سهولة الشرح</li>
<li>بعد ذلك نقوم بالضغط على تحرير html و ننقر وسط الأكواد.</li>
<li>نبحث عن هذا الوسم <b><span style="color: blue;">]]></b:skin></span></b> مستعينا بالزراين(ctrl+f).</li>
<li>ثم ضع فوقه هذا الكود مباشرة و قم بحفظ القالب.</li>
</ol>
</div>
<div style="text-align: center;">
<div style="text-align: center;">
<blockquote class="tr_bq">
#warch {<br />
margin: 20px auto;<br />
text-align: center;<br />
}<br />
<br />
#warch br {<br />
display: none;<br />
}<br />
<br />
.mo-slide, .mo-slide2 {<br />
position: relative;<br />
display: inline-block;<br />
height: 50px;<br />
width: 200px;<br />
line-height: 50px;<br />
padding: 0;<br />
border-radius: 50px;<br />
background: #fdfdfd;<br />
border: 2px solid #0099cc;<br />
margin: 10px;<br />
transition: .5s;<br />
}<br />
<br />
.mo-slide2 {<br />
border: 2px solid #efa666;<br />
}<br />
<br />
.mo-slide:hover {<br />
background-color: #0099cc;<br />
}<br />
<br />
.mo-slide2:hover {<br />
background-color: #efa666;<br />
}<br />
<br />
.mo-slide:hover span.circle, .mo-slide2:hover span.circle2 {<br />
left: 100%;<br />
margin-left: -45px;<br />
background-color: #fdfdfd;<br />
color: #0099cc;<br />
}<br />
<br />
.mo-slide2:hover span.circle2 {<br />
color: #efa666;<br />
}<br />
<br />
.mo-slide:hover span.title, .mo-slide2:hover span.title2 {<br />
left: 40px;<br />
opacity: 0;<br />
}<br />
<br />
.mo-slide:hover span.title-hover, .mo-slide2:hover span.title-hover2 {<br />
opacity: 1;<br />
left: 40px;<br />
}<br />
<br />
.mo-slide span.circle, .mo-slide2 span.circle2 {<br />
display: block;<br />
background-color: #0099cc;<br />
color: #fff;<br />
position: absolute;<br />
float: left;<br />
margin: 5px;<br />
line-height: 42px;<br />
height: 40px;<br />
width: 40px;<br />
top: 0;<br />
left: 0;<br />
transition: .5s;<br />
border-radius: 50%;<br />
}<br />
<br />
.mo-slide2 span.circle2 {<br />
background-color: #efa666;<br />
}<br />
<br />
.mo-slide span.title,<br />
.mo-slide span.title-hover, .mo-slide2 span.title2,<br />
.mo-slide2 span.title-hover2 {<br />
position: absolute;<br />
left: 90px;<br />
text-align: center;<br />
margin: 0 auto;<br />
font-size: 16px;<br />
font-weight: bold;<br />
color: #30abd5;<br />
transition: .5s;<br />
}<br />
<br />
.mo-slide2 span.title2,<br />
.mo-slide2 span.title-hover2 {<br />
color: #efa666;<br />
left: 80px;<br />
}<br />
<br />
.mo-slide span.title-hover, .mo-slide2 span.title-hover2 {<br />
left: 80px;<br />
opacity: 0;<br />
}<br />
<br />
.mo-slide span.title-hover, .mo-slide2 span.title-hover2 {<br />
color: #fff;<br />
}</blockquote>
</div>
ثم إبحث عن هذا الوسم <b><span style="color: blue;"><head></span></b><span style="color: blue;"> <span style="color: black;">وضع الكود</span></span> التالي بعده مباشرة و قم بحفظ القالب.</div>
<div style="text-align: center;">
</div>
<div style="text-align: center;">
</div>
<div style="text-align: center;">
</div>
<div style="text-align: center;">
<blockquote class="tr_bq">
<link href='
https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.0.0/css/font-awesome.css'
rel='stylesheet'
type='text/css'/></blockquote>
الآن طريقة التعامل مع الأزرار في المواضيع.</div>
<div style="text-align: center;">
عند قيامك بكتابة موضوع قم بالنقر على زر "خيارات" و قم بتعديلها كما تلاحظ في الصورة.</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhePz23ImLnyxq9B6x2LR57KKtXwc_qfz6_LfQOziksrSJPMmDYQ5R4QBWOgvVZ6eaN_MxN4ZtjY7dB0-__iCScurvnMHy7a0hUIFzHYUatisLaDcZibqboUr7C2r1TvHsgDohUlQuDsbg/s1600/Capture.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhePz23ImLnyxq9B6x2LR57KKtXwc_qfz6_LfQOziksrSJPMmDYQ5R4QBWOgvVZ6eaN_MxN4ZtjY7dB0-__iCScurvnMHy7a0hUIFzHYUatisLaDcZibqboUr7C2r1TvHsgDohUlQuDsbg/s1600/Capture.PNG" /></a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
أما بالنسبة للأزرار فسوف تضع هذا الكود في المكان الذي يعجبك وذلك في واجهة html الخاصة بالمواضيع.</div>
<blockquote class="tr_bq">
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<div id="warch"><br />
<a href="<span style="color: red;">#</span>" class="mo-slide" target="_blank"><br />
<span class="circle"><i class="fa fa-rocket"></i></span><br />
<span class="title">معاينة</span><br />
<span class="title-hover">إنقر هنا</span><br />
</a><br />
<a href="<span style="color: blue;">#</span>" class="mo-slide2" target="_blank"><br />
<span class="circle2"><i class="fa fa-download"></i></span><br />
<span class="title2">تحميل</span><br />
<span class="title-hover2">إنقر هنا</span><br />
</a><br />
</div></div>
</blockquote>
<div style="text-align: right;">
قم بتغير علامة <span style="color: red;">#</span> برابط المعاينة و العلامة <span style="color: blue;">#</span> برابط التحميل.<br />
<span style="color: red;">ملاحظة :</span> هذا الكود يحتوي على نموذج التحميل و المعاينة أي زرين في نفس الوقت يمكنكم إستعملهما كما تريد.</div>
<div style="text-align: right;">
<b><span style="color: blue;"></span></b><span style="color: blue;"></span>هذا كل ما في موضوع اليوم أتمنى لكم التوفيق في عملكم ، دمتم بود في أمان الله. </div>
<div style="text-align: right;">
<br /></div>
<div style="text-align: right;">
<br /></div>
</div>
Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-8722635733075134433.post-86687798831774101282014-12-23T12:15:00.001-08:002014-12-23T12:18:17.410-08:00تقسيم نص التدوينة إلى عمودين أو أكثر <div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT6xMrRTYf_2qzbyclmzy3MmG7D1esy7mR_q0RvqN0O51fAjcwZnCC3A7gD58dGoxKKbuKMH2_IYMUAMdP18LN-wBd88JxuU630clX0Qn0WJmR6mXD2LTWdnqxqVO5arldeiyLSPBjY5M/s1600/%D8%AA%D9%82%D8%B3%D9%8A%D9%85+%D9%85%D9%88%D8%A7%D8%B6%D9%8A%D8%B9+%D8%A7%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A9+%D8%A5%D9%84%D9%89+%D8%A3%D8%B9%D9%85%D8%AF%D8%A9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT6xMrRTYf_2qzbyclmzy3MmG7D1esy7mR_q0RvqN0O51fAjcwZnCC3A7gD58dGoxKKbuKMH2_IYMUAMdP18LN-wBd88JxuU630clX0Qn0WJmR6mXD2LTWdnqxqVO5arldeiyLSPBjY5M/s1600/%D8%AA%D9%82%D8%B3%D9%8A%D9%85+%D9%85%D9%88%D8%A7%D8%B6%D9%8A%D8%B9+%D8%A7%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A9+%D8%A5%D9%84%D9%89+%D8%A3%D8%B9%D9%85%D8%AF%D8%A9.png" /></a></div>
السلام عليكم و رحمة الله وبركاته.<br />
كما تعودنا دائما مع ورشة مدون نتعلم أشياء جديدة تجعلنا نتحسن يوما بعد يوم، تختلف أغراض التدوين و تختلف مجالاته أيضا، فهناك مدونات عامة و مدونات شخصية أي تهم صاحبها فقط و غرضنا اليوم هو إضفاء لمسة جديدة عن شكل المواضيع في المواقع أو المدونات، و هذه الأخيرة تتم عبر تقسيم الموضوع إلى عمودين أو أكثر و جعل الكتابة شبيهة بالشكل المتداول في الصحف و المجلات<br />
هذه الإضافة مميزة وستزيد من جمالية مدونتك، خصوصا المدونات التي بها مواضيع طويلة و التي تتعب الزائر الذي يقرأها.<br />
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<a href="http://demo-mo.blogspot.com/2014/12/blog-post_25.html" rel="nofollow" target="_blank"><span style="color: orange;"><span style="font-size: large;"><b>(((( معاينة الإضافة ))))</b></span></span></a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<u><span style="color: red;">طريقة إضافة الآداة</span></u></div>
<ol style="text-align: right;">
<li><span style="color: red;"><span style="color: black;">نذهب للوحة التحكم بلوجر ثم القالب ثم ننقر تحرير html</span> </span></li>
<li><span style="color: red;"> <span style="color: black;">ننقر وسط الأكواد و نستعن بـ ( crtl+f) للبحث عن الوسم التالي: <b><span style="color: blue;">]]></b:skin></span></b></span></span></li>
<li><span style="color: red;"><span style="color: black;"><span style="color: blue;"><span style="color: black;">بعدها نقوم بوضع الكود التالي فوقه مباشرة.</span></span></span></span></li>
</ol>
<div style="text-align: center;">
<blockquote class="tr_bq">
<div style="text-align: center;">
<span style="color: red;"><span style="color: black;"><span style="color: blue;"><span style="color: black;">.warchgufs<br />{<br /> -webkit-column-count: <span style="color: red;">2</span>;<br /> -moz-column-count: <span style="color: red;">2</span>;<br /> column-count: <span style="color: red;">2</span>;<br />} </span></span><b><span style="color: blue;"> </span></b></span></span></div>
</blockquote>
<span style="color: red;"></span></div>
<div>
<div style="text-align: center;">
الرقم <span style="color: red;">2</span> هو عدد الأعمدة يمكنك تغيره بما يعجبك.</div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<u><span style="color: red;">طريقة التطبيق على المواضيع.</span></u></div>
<div style="text-align: center;">
<span style="color: red;"> </span> </div>
<div style="text-align: center;">
عند كتابتك لموضوع معين و تريد أن يظهر على شكل أعمدة ، قم بوضع النص داخل الكود التالي:</div>
<blockquote class="tr_bq">
<div style="text-align: center;">
<div class='warchgufs'> <span style="color: red;">ضع نص الموضوع هنا</span> </div></div>
</blockquote>
<div style="text-align: center;">
مكان العبارة الحمراء ضع النص المراد تقسيمه</div>
<div style="text-align: right;">
هذا كل ما في موضوع اليوم أثمنى أن أكون قد أفدتكم ، أي إستفسار أنا في الخدمة ، بالتوفيق للجميع في أمان الله. </div>
</div>
</div>
Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-8722635733075134433.post-59746805763916301822014-12-17T09:02:00.002-08:002014-12-17T09:08:39.097-08:00تحميل قالب COM4ME الخاص بالمدونات في طور الإنشاء أو الإصلاح<div dir="rtl" style="text-align: right;" trbidi="on">
<div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjw132xCis2ny135v0_UcDWdntYGP6mjv5k3y6Lbb9kREvNVzaWy8M_a4sFNC2oDDhDGZVHiEaQHl3cdlsShkFK5atgSXuD0sYHdd4ZyY_l5xSrXRXfc1yRXoNlTh6NOP65TzDld8h_19k/s1600/%D9%82%D8%A7%D9%84%D8%A8+COM4ME+%D8%AE%D8%A7%D8%B5+%D8%A8%D8%A7%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A7%D8%AA+%D9%81%D9%8A+%D8%B7%D9%88%D8%B1+%D8%A7%D9%84%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D8%A3%D9%88+%D8%A7%D9%84%D8%A5%D8%B5%D9%84%D8%A7%D8%AD.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjw132xCis2ny135v0_UcDWdntYGP6mjv5k3y6Lbb9kREvNVzaWy8M_a4sFNC2oDDhDGZVHiEaQHl3cdlsShkFK5atgSXuD0sYHdd4ZyY_l5xSrXRXfc1yRXoNlTh6NOP65TzDld8h_19k/s1600/%D9%82%D8%A7%D9%84%D8%A8+COM4ME+%D8%AE%D8%A7%D8%B5+%D8%A8%D8%A7%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A7%D8%AA+%D9%81%D9%8A+%D8%B7%D9%88%D8%B1+%D8%A7%D9%84%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D8%A3%D9%88+%D8%A7%D9%84%D8%A5%D8%B5%D9%84%D8%A7%D8%AD.png" /></a></div>
السلام عليكم و رحمة الله وبركاته.<br />
غالب المدونين يقومون ببعض الإصلاحات و التعديلات، في مدوناتهم إما في المحتوى وطرق عرضه ، أو في القالب و أو إضافة معينة ، و في هذه المرحلة قد يتشوه القالب أحيانا لقدر الله ، و إن كانت المدونة لها زوار و متابعين كثر قد يأخدون إنطباع سيئ على مدونتك، و في أغلب الحالات يقوم أصحاب المدونات بتلبيس مدوناتهم بقوالب تخبر الزوار بأن الموقع في طور الإنشاء أو الإصلاح.<br />
هذا ما جعلني اليوم أطرح هذا القالب الخاص بمدونات البلوجر في طور التعديل أو الإصلاح، والذي يعكس لدى الزوار ما إحترافية المدون في إدارة مدونته .<br />
<div style="text-align: center;">
<a href="http://test-4416.blogspot.com/" rel="nofollow" target="_blank"><span style="font-size: large;"><span style="color: orange;"><b>((((معاينة القالب)))) </b></span></span></a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<a href="http://www.gulfup.com/?yF5z8d" rel="nofollow" target="_blank"><b><span style="color: red;"><span style="color: #6aa84f; font-size: large;">((((تحميل القالب))))</span></span></b></a></div>
<div style="text-align: center;">
<b><span style="color: red;"><span style="color: #6aa84f; font-size: large;"><span style="font-size: small;"><span style="color: #3d85c6;">باسورد فك الضغط</span></span><span style="color: #3d85c6;">:</span> </span></span></b></div>
<div style="text-align: center;">
<span style="color: #134f5c;"><b> warch-mo.blogspot.com</b></span></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<b><span style="color: red;">مميزات القالب:</span></b></div>
<ol style="text-align: right;">
<li>قالب سهل التركيب</li>
<li>تنسيق وتصميم إحترافي.</li>
<li>خالي من الأخطاء و العيوب.</li>
<li>يعتمد لونين أساسيين الأزرق و الأسود.</li>
<li>يحتوي على عداد يبين متى سيستأنف الموقع العمل مجددا.</li>
<li>يحتوي صندوق الإشتراكات البريدية من أجل توصل متابعيك بأول نشاط لك بعد رجوعك للتدوين. </li>
<li>كما يحتوي على أزرار مواقع التواص الإجتماعي.</li>
</ol>
</div>
<div style="text-align: center;">
<span style="color: red;"><b>تعديلات على القالب:</b></span></div>
<div style="text-align: right;">
1- التعديل على العداد قم بالبحث عن هذا الكود : <b><span style="color: blue;"><!--Countdown Script--></span></b></div>
<div style="text-align: right;">
بعد أن تجده إنزل قليلا سوف تلاحظ التاريخ الذي قمت بإدراجه مسبقا قم بتغيره بما يناسبك . شاهد الصورة</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpzA-7XNsgZDJwzPYEBcGh_3FIZDyf_Y2MPzJYKteGcXLzpiGR0lf4tsK-AEpXSedFi5wIS7NwD2IQ3SqFnZBtAhJ3g0gMhS1D120zsNiXMyUKWgB6Yktfpr8YXRypAu0PUoZV6ajW0xo/s1600/%D9%82%D8%A7%D9%84%D8%A8+COM4ME.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpzA-7XNsgZDJwzPYEBcGh_3FIZDyf_Y2MPzJYKteGcXLzpiGR0lf4tsK-AEpXSedFi5wIS7NwD2IQ3SqFnZBtAhJ3g0gMhS1D120zsNiXMyUKWgB6Yktfpr8YXRypAu0PUoZV6ajW0xo/s1600/%D9%82%D8%A7%D9%84%D8%A8+COM4ME.PNG" height="122" width="400" /></a></div>
<div style="text-align: right;">
الرقم <span style="color: blue;">23</span> خاص باليوم.</div>
<div style="text-align: right;">
<span style="color: blue;">December:</span> خاص بالشهر يكتب بالإنجليزية فقط إحترس أن لا تكتبه الفرنسية.</div>
<div style="text-align: right;">
<span style="color: blue;">2015:</span> هذا واضح خاص بالسنة.</div>
<div style="text-align: right;">
<span style="color: blue;">1:</span> خاص بالساعات.</div>
<div style="text-align: right;">
<span style="color: blue;">50:</span> خاص بالدقائق .</div>
<div style="text-align: right;">
<span style="color: blue;">30:</span> خاص بالتواني.</div>
<div style="text-align: right;">
هذا كل مافي الأمر يمكنك تغيره حسب رغبتك.</div>
<div style="text-align: right;">
أتمنى أن يعجبك القالب إن واجهت أي صعوبة أنا في الخدمة بالتوفيق قي أمان الله.</div>
</div>
Unknownnoreply@blogger.com1tag:blogger.com,1999:blog-8722635733075134433.post-30858353443754614822014-12-16T11:30:00.003-08:002014-12-16T11:30:42.088-08:00تطبيقات أندرويد مهمة المدونين على البلوجر<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEij_yjh_C_JRsuBV1_lhNGC3OuIO3WJ9SoZjanjGI8XGl47scGNdRpLnQZqygvneLc36xs-kqAFl7Jss6yd-b1dEOFyLZkIzr_UvB7gyxtQLy-VHQ-OfMPJmK3XN0J-8Vfsnqy3LvzuBuc/s1600/%D8%A3%D9%87%D9%85+%D8%AA%D8%B7%D8%A8%D9%8A%D9%82%D8%A7%D8%AA+%D8%A7%D9%84%D8%A3%D9%86%D8%AF%D8%B1%D9%88%D9%8A%D8%AF+%D8%A7%D9%84%D8%AA%D9%8A+%D8%AA%D8%AD%D8%AA%D8%A7%D8%AC%D9%87%D8%A7+%D9%83%D9%85%D8%AF%D9%88%D9%86.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEij_yjh_C_JRsuBV1_lhNGC3OuIO3WJ9SoZjanjGI8XGl47scGNdRpLnQZqygvneLc36xs-kqAFl7Jss6yd-b1dEOFyLZkIzr_UvB7gyxtQLy-VHQ-OfMPJmK3XN0J-8Vfsnqy3LvzuBuc/s1600/%D8%A3%D9%87%D9%85+%D8%AA%D8%B7%D8%A8%D9%8A%D9%82%D8%A7%D8%AA+%D8%A7%D9%84%D8%A3%D9%86%D8%AF%D8%B1%D9%88%D9%8A%D8%AF+%D8%A7%D9%84%D8%AA%D9%8A+%D8%AA%D8%AD%D8%AA%D8%A7%D8%AC%D9%87%D8%A7+%D9%83%D9%85%D8%AF%D9%88%D9%86.png" /></a></div>
شهدنا في الآونة الأخيرة إنتشار و إقبال ملحوظ على الأجهزة الذكية سواء الألواح الإلكترونية أو هواتف الذكية و موضوعنا اليوم سنرى فيه كيف سنستثمر هذا المجال في خدمة الناشرين والمدونين ، وذلك من خلال بعض التطبيقات التي سوف تسهل شيئا ما لهم التدوين و مراقبة مدوناتهم أو مواقعهم و التوصل بكل الإحصائيات سواء تعلق الأمر بالجانب التقنية أو المالية، و كل هذه التطبيقات متوفرة على جوجل بلاي.<br />
سنقوم بتصنيف هذه التطبيقات حسب مهمتها.<br />
<div style="text-align: center;">
<span style="color: magenta;">*صورة مأخوذة للتطبيقات التي أستخدمها شخصيا </span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCD1XIIeGUti7L_fC-VYUqaC-d-DPPjTNXDG5LmVWxoMqhfYAxEqtd_7W8RNjJAtjLrfKNClrBNkKaC462yW_WALCmOsTzgQDtd-OssGef4P9_-kLvVZoDIz-_U_uG2xwR0iV9hybv-F0/s1600/apps-android-on-blogging.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCD1XIIeGUti7L_fC-VYUqaC-d-DPPjTNXDG5LmVWxoMqhfYAxEqtd_7W8RNjJAtjLrfKNClrBNkKaC462yW_WALCmOsTzgQDtd-OssGef4P9_-kLvVZoDIz-_U_uG2xwR0iV9hybv-F0/s1600/apps-android-on-blogging.png" height="400" width="240" /></a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<span style="font-size: large;"><b><span style="color: red;">خاصة بالتدوين</span></b></span></div>
<span style="color: #6aa84f;">1- blogger:</span> تطبيق بلوجر الرسمي يتم تحديثه بإستمرار، يمكنك من كتابة تدويناتك بسرعة و راحة تامة، كما يمكن أن تحفظها كمسودة أو نشرها فورا، كما تستطيع إضافة صور من جهازك أو إلتقاطها مباشرة و يمكنك تحميله من هذا <a href="https://play.google.com/store/apps/details?id=com.google.android.apps.blogger" rel="nofollow" target="_blank"><b><span style="color: blue;">[الرابط]</span></b></a>.<br />
<br />
<span style="color: #6aa84f;">2- blogaway:</span> هذا أيضا تطبيق بلوجر يساعدك على كتابة مواضيعك مع إمكانية إدراج صور أو فيديو من جهازك ، و تستطيع إدارة عدة مدونات من خلاله و يمكنك تحميله من هذا <a href="https://play.google.com/store/apps/details?id=com.beanie.blog" rel="nofollow" target="_blank"><b><span style="color: blue;">[الرابط]</span></b></a>.<br />
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<b><span style="font-size: large;"><span style="color: red;">خاصة بمتابعة جديد المواقع</span></span></b></div>
<span style="color: #6aa84f;">3- Tadween:</span> تطبيق عربي مميز يمكنك من متابعة جديد المواقع و المدونات التي تستهويك من خلال خلاصات RSS، حيث تستطيع من خلاله إنشاء قوائم و تصنيفها حسب المجلات المهتم بها، ويمكنك تحميله من هذا <a href="https://play.google.com/store/apps/details?id=com.app.tadween" rel="nofollow" target="_blank"><b><span style="color: blue;">[الرابط]</span></b></a>.<br />
<br />
<span style="color: #6aa84f;">4- gReader | Feedly | News | RSS:</span> تطبيق أجنبي أخر يمكنك من متابعة جديد أخبار المواقع المفضلة لديك ، كما يمكنك من قراءة المواضيع حتى في غياب الشبكة اللاسلكية WI-FI ، ويمكنك تحميله من هذا <a href="https://play.google.com/store/apps/details?id=com.noinnion.android.greader.reader" rel="nofollow" target="_blank"><b><span style="color: blue;">[الرابط]</span></b></a>.<br />
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<span style="font-size: large;"><span style="color: red;"><b>خاصة بالإحصائيات</b></span></span></div>
<span style="color: #6aa84f;">5- adsnse:</span> تطبيق رسمي لشبكة جوجل أدسنس الإعلانية، و يمكن أصحاب المدونات و المواقع الربحية من متابعة كل التفاصيل الخاصة مستحقات الدفع الخاصة بمواقعهم، ويمكنك تحميله من هذا <a href="https://play.google.com/store/apps/details?id=com.google.android.apps.ads.publisher" rel="nofollow" target="_blank"><b><span style="color: blue;">[الرابط]</span></b></a>.<br />
<br />
<span style="color: #6aa84f;">6- WebRank SEO:</span> هذا التطبيق يمكن مدراء المواقع و المدونات من مراقبة مؤشرات السيو، و ذلك بالتعرف على ترتيب أليكسا و البايج رانك بالإضافة إلى المزيد من الميزات الأخرى، و يمكنك تحميله من <a href="https://play.google.com/store/apps/details?id=com.probcomp.webrankstats" rel="nofollow" target="_blank"><b><span style="color: blue;">[الرابط]</span></b></a>. <br />
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<span style="font-size: large;"><b><span style="color: red;">خاصة بالتخزين السحابي</span></b></span></div>
<div style="text-align: right;">
<span style="color: #6aa84f;">1- Dropbox:</span> تطبيق مشهور جدا يمكنك ، من رفع جميع أنواع الملفات و يستعمل بكثرة في رفع الأكواد البرمجية والحصول على الروابط المباشرة، ويمكنك تحميله من <a href="https://play.google.com/store/apps/details?id=com.dropbox.android" rel="nofollow" target="_blank"><b><span style="color: blue;">[الرابط]</span></b></a>.</div>
<div style="text-align: right;">
<br /></div>
<div style="text-align: center;">
<span style="font-size: large;"><b><span style="color: red;">خاصة تعديل و تنسيق الصور</span></b></span></div>
<div style="text-align: right;">
<span style="color: #6aa84f;">1-PicsArt - Studio Photo:</span> من أضخم تطبيقات تعديل وتركيب الصور، تستطيع أن تقول فوتوشوب الأندرويد ، يمكنك إستخدامه للتعديل و الكتابة على صور مواضيعك، ويمكنك تحميله من هذا <a href="https://play.google.com/store/apps/details?id=com.picsart.studio" rel="nofollow" target="_blank"><span style="font-size: small;"><b><span style="color: blue;">[الرابط]</span></b></span></a>.</div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<span style="font-size: large;"><b><span style="color: red;"> خاصة بالمواقع الإجتماعية</span></b></span></div>
<div style="text-align: right;">
<span style="color: #6aa84f;">1- Pages Manager:</span> تطبيق رائع خاص بالفيسبوك، هدفه إدارة الصفحات الإجتماعية، يمكنك إستخدامه للترويج لمنشورات مدونتك، يمكنك تحميله من <a href="https://play.google.com/store/apps/details?id=com.facebook.pages.app" rel="nofollow" target="_blank"><b><span style="color: blue;">[</span><span style="color: blue;">الرابط]</span></b></a>.</div>
<div style="text-align: right;">
<span style="color: #6aa84f;">2- Twitter:</span> هذا أيضا تطبيق يمكنك من إيصال جديد مواضيعك لمتابعيك على تويتر، وإبقائه على إطلاع دائم على نشاطاتك ، ويمكنك تكميله من <a href="https://play.google.com/store/apps/details?id=com.twitter.android" rel="nofollow" target="_blank"><b><span style="color: blue;">[الرابط]</span></b></a>.</div>
<div style="text-align: right;">
<span style="color: #6aa84f;">3- YouTube:</span> تطبيق يوتيوب يمكنك من مشاهدة الفيديوهات و بالإضافة إلى رفعها على قناتك في حالة قمت بتصويرها. و يمكنك تحميله من هذا <a href="https://play.google.com/store/apps/details?id=com.google.android.youtube" rel="nofollow" target="_blank"><b><span style="color: blue;">[الرابط]</span></b></a>.</div>
<div style="text-align: right;">
<br /></div>
<div style="text-align: right;">
توجد العديد من التطبيقات الأخرى و لقد تم إختيار هذه لكونها الأفضل، وهي التي أستخدم شخصيا، يمكنك أن تشاركنا بتطبيق جديد فمتجر جوجل بلاي دائما متجدد.</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-33173627407847423412014-12-14T09:45:00.000-08:002014-12-14T09:45:30.363-08:00تعلم كيفية مسك الكلمات المفتاحية لمواضيعك في محركات البحث<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJVl5WEB1pUmoAGuqZkALVZ-eYebuTTI320H4hBdLna4YTCet8s_j7OxiSL8yAG-u5JnraKgCoYJFe6WZP1iwkfz8jSPHaIinrg3RYWUCNv2lIf9KQBskuEAPO7IHkzh3Wl60k3_yKQc4/s1600/keywords.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJVl5WEB1pUmoAGuqZkALVZ-eYebuTTI320H4hBdLna4YTCet8s_j7OxiSL8yAG-u5JnraKgCoYJFe6WZP1iwkfz8jSPHaIinrg3RYWUCNv2lIf9KQBskuEAPO7IHkzh3Wl60k3_yKQc4/s1600/keywords.png" /></a></div>
<br />
السلام عليكم و رحمة الله و بركاته،<br />
لاشك أن العديد من المدونين و مدراء المواقع المبتدئين يصارعون من أجل كسب ثقة محركات البحث، وهذا من أجل أن تكون النتائج الأولى في بحث جوجل من نصيب مواضيعهم، وهذا قد ينجح فيه بعض المدونين و قد يفشل فيه أخرون، فكل واحد يبحث عن زوار لموقعه خصوصا من محركات البحث.<br />
<br />
و اليوم سوف نرى كيف يمكننا مسك الكلمات المفتاحية في محركات البحث، فعلا الرغم من الكلمات المفتاحية التي نقوم بوضعها في أكواد الميتا الخاصة بالقالب إلا أنها لا تكفي، فالأمر يتعلق بمحتوى الويب الذي يشهد تطورا لا على مستوى المضمون و لا على مستوى أسلوب التحرير. وللأسف قد تجد بعض المواضيع قمة في الروعة و الفائدة و لكنها في الصفحة التانية أو الثالثة من نتائج البحث بينما تجد موضوع أخر في الصفحة الأولى حتى القواعد اللغوية غير مظبوطة به، لأن في هذه المرحلة<a href="http://warch-mo.blogspot.com/2014/03/how-seo.html" target="_blank"> تقنيات السيو</a> هي التي تحكم.<br />
<br />
كي تحجز لمواضيعك مكانا يليق بهاعليك أن تعتمد على هذه الخطوات في تحرير مواضيعك :<br />
<br />
<ol style="text-align: right;">
<li><span style="color: red;"><b>العنوان :</b></span> يجب أن يكون في حدود الكلمات المعبرة عن الموضوع و لا تقم بحشر كلمات لا دخل لها بالموضوع، لتجنب تشتيت إنتباه عناكب محركات البحث. كلما ركزت في العنوان كلما كان أفضل.<br /> </li>
<li><b><span style="color: red;">تنسيق رابط الموضوع :</span></b> فهناك بعض المدونين يتهونون في تنسيق روابط تدويناتهم . وهذا خطأ كبير ؛ بحيث يقومون بإهدار لبنة أساسية من تقنيات السيو كلمات الرابط من الأدوات المهمة التي تعتمد عليها محركات البحث فإذا كنت بصدد كتابة تدوينة لا تنسى إدراج بعد الكلمات المعبرة عن مضمون تدوينتك شرط أن لا يكون الرابط طويلا 4 كلمات كحد أقصى.<br /> </li>
<li><b><span style="color: red;">توزيع الكلمات المفتاحية :</span></b> بشكل متساوي في الفقرات من جهة و في التدوينة كلها من جهة أخرى، -و لا أقصد حشوها- بالإضافة إدراج مرادفات للكلمات المفتاحية فهذا أيضا تعتمد عليه محركات البحث خاصة العملاق جوجل و سعر نقرة بالنسبة لأدسنس مشابه للكلمات المفتاحية الأساسية.<br /> </li>
<li><b><span style="color: red;">وصف البحث :</span></b> أيضا مهم جدا عند كتابة أي تدوينة لا تنسى أن تكتب وصف مناسب و الوصف يكون مثل العنوان إلا أنه قد يكون أطول جملتين مثلا.و هو يشمل توضيحات عن الموضوع الذي تعالجه تدوينتك.<br /> </li>
<li><b><span style="color: red;">المصطلحات الأجنبية :</span></b> كتابة بعض المصطلحات التي هي دخيلة عن اللغة العربية بالحروف اللاتينية مثلا سيو - Seo ترافيك Traffic و هكذا .<br /> </li>
<li><b><span style="color: red;">الرابط النصي :</span></b> و يعني هذا الإحالة إلى مواضيع سابقة و ذلك في حالة ذكرك لمصطلح أو موضوع سابق ، تقوم بإدراج رابط الموضوع بشرط ألا تتجاوز 3 روابط . هذه الطريقة أيضا تساهم في مسك الكلمات المفتاحية في محركات البحث، بالإضافة إلا <a href="http://warch-mo.blogspot.com/2014/03/back-links.html" target="_blank">بناء شبكة باك لينك داخلية قوية</a>.<br /> </li>
<li><b><span style="color: red;">تسمية الصور:</span></b> وهذا يعني في حالة كنت تخصص صور لتدويناتك سواء كنت تصممها بنفسك أو تجلبها من الأنترنيت، من الضروري إعادة تسميتها بكلمات دالة عن الموضوع و هذا أيضا ينبغي عليك أن لا تهمله.</li>
</ol>
<br />
هذه الأساليب يعتمدها مدراء كبار المواقع و المدونات، إذا كل ما عليك هو حسن تطبيق للخطوات التي رأيناها مع الصبر لأن الأمر ليس بالسهل و لن يتحقق في يوم أو يومين و مع مرور الوقت سوف تلاحظ أن حتى واردات الإعلانات تزداد بفضل من الله تعالى. <br />
<br />
هذا كل ما في الأمر أتمنى أن لا أنسى شيئا، و في حالة إعتمادك على أساليب أخرى يمكنك أن تشاركها معنا في تعليق من أجل مناقشتها و تصحيح العديد من الطرق التي تطرحها بعدض الشرحات المغلوطة.</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-41064956520639730412014-12-09T06:44:00.000-08:002014-12-10T09:30:10.550-08:00كيفية وضع أزرار css لروابط مواضيع المدونة<div dir="rtl" style="text-align: right;" trbidi="on">
<div>
<div style="text-align: right;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEOBOL13RY-Eqti0MPddIfqkJ7wzJYfOsX098m46-ko8cFzZgCSF8NMRmgLb5fW1LZEu-cggrSYGwQI6_hwBbpHNX1qW2078O45XT4WC9hsn_pzKbpnIjNPzzRlXlmnTq1QFmIu9NG-y4/s1600/%D9%83%D9%8A%D9%81%D9%8A%D8%A9+%D9%88%D8%B6%D8%B9+%D8%A3%D8%B2%D8%B1%D8%A7%D8%B1+css+%D9%84%D8%B1%D9%88%D8%A7%D8%A8%D8%B7+%D9%85%D9%88%D8%A7%D8%B6%D9%8A%D8%B9+%D8%A7%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEOBOL13RY-Eqti0MPddIfqkJ7wzJYfOsX098m46-ko8cFzZgCSF8NMRmgLb5fW1LZEu-cggrSYGwQI6_hwBbpHNX1qW2078O45XT4WC9hsn_pzKbpnIjNPzzRlXlmnTq1QFmIu9NG-y4/s1600/%D9%83%D9%8A%D9%81%D9%8A%D8%A9+%D9%88%D8%B6%D8%B9+%D8%A3%D8%B2%D8%B1%D8%A7%D8%B1+css+%D9%84%D8%B1%D9%88%D8%A7%D8%A8%D8%B7+%D9%85%D9%88%D8%A7%D8%B6%D9%8A%D8%B9+%D8%A7%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A9.png" /></a></div>
السلام عليكم و رحمة الله وبركاته.</div>
<div style="text-align: right;">
تنسيق أزرار التحميل أو المعاينة ببرمجة css، هذه الأزرار تضفي جمالية على مواضيع مدونتك، و تجعل روابط مدونتك في حلة جميلة و إحترافية، عكس الطريقة التقليدية، بالإختصار بكتابة الرابط مباشرة أو عبارة معينة مع إضافة الإرتباط، و الجميل في هذه الأزرار هي أنك تستطيع أن تتحكم في لونها و شكلها و أن تضيف تأثيراتها، فقط بالقليل من الخبرة في أكواد css .</div>
<div style="text-align: center;">
<br />
<a href="http://test-add-blog.blogspot.com/2014/12/blog-post_9.html" rel="nofollow" target="_blank"><span style="color: orange;"><span style="font-size: large;"><b>((((معاينة الزر))))</b></span></span></a></div>
<h3 style="text-align: center;">
طريق التركيب </h3>
<ol style="text-align: right;">
<li>قم بالدخول للوحة النجكم بلوجر ثم القالب ثم إنقر تحرير html .</li>
<li>إنقر وسط الأكواد، إستعن بالزرين (ctrl+f) للبحث عن هذا الوسم: <b><span style="color: blue;"><b:skin></span></b></li>
<li>ثم ضع الكود التالي مباشرة فوق الوسم الذي وجدته.</li>
</ol>
<blockquote class="tr_bq">
<div style="text-align: left;">
/* === Button warch-mo Style === */<br />
<br />
.warch-button {<br />
background-color: <span style="color: #6aa84f;">#68b12f</span>;<br />
background-image: -webkit-gradient(linear, left top, left bottom, from(<span style="color: #990000;">#CBF3AC</span>), to(<span style="color: #ea9999;">#50911e</span>));<br />
background-image: -webkit-linear-gradient(top, <span style="color: #990000;">#CBF3AC</span>, <span style="color: #ea9999;">#50911e</span>);<br />
background-image: -moz-linear-gradient(top, <span style="color: #990000;">#CBF3AC</span>, <span style="color: #ea9999;">#50911e</span>);<br />
background-image: -ms-linear-gradient(top, <span style="color: #990000;">#CBF3AC</span>, <span style="color: #ea9999;">#50911e</span>);<br />
background-image: -o-linear-gradient(top, <span style="color: #990000;">#CBF3AC</span>, <span style="color: #ea9999;">#50911e</span>);<br />
background-image: linear-gradient(top, <span style="color: #990000;">#CBF3AC</span>, <span style="color: #ea9999;">#50911e</span>);<br />
border: 1px solid <span style="color: #f1c232;">#509111</span>;<br />
border-bottom: 1px solid #5b992b;<br />
border-radius: <span style="color: red;">3px</span>;<br />
-webkit-border-radius: <span style="color: red;">3px</span>;<br />
-moz-border-radius: <span style="color: red;">3px</span>;<br />
-ms-border-radius: <span style="color: red;">3px</span>;<br />
-o-border-radius: <span style="color: red;">3px</span>;<br />
box-shadow: inset 0 1px 0 0 #9fd574;<br />
-webkit-box-shadow: 0 1px 0 0 #9fd574 inset ;<br />
-moz-box-shadow: 0 1px 0 0 #9fd574 inset;<br />
-ms-box-shadow: 0 1px 0 0 #9fd574 inset;<br />
-o-box-shadow: 0 1px 0 0 #9fd574 inset;<br />
color: <span style="color: #674ea7;">white</span>;<br />
font-weight: bold;<br />
padding: 8px 25px;<br />
text-align: center;<br />
}<br />
.warch-button:hover {<br />
opacity:.85;<br />
cursor: pointer;<br />
background-image: -webkit-linear-gradient(top, <span style="color: magenta;">#50911e</span>, <span style="color: #e69138;">#CBF3AC</span>);<br />
background-image: -moz-linear-gradient(top, <span style="color: magenta;">#50911e</span>, <span style="color: #e69138;">#CBF3AC</span>);<br />
}<br />
.warch-button:active {<br />
border: 1px solid #20911e;<br />
box-shadow: 0 0 10px 5px #356b0b inset;<br />
-webkit-box-shadow:0 0 10px 5px #356b0b inset ;<br />
-moz-box-shadow: 0 0 10px 5px #356b0b inset;<br />
-ms-box-shadow: 0 0 10px 5px #356b0b inset;<br />
-o-box-shadow: 0 0 10px 5px #356b0b inset;<br />
} </div>
</blockquote>
<div style="text-align: right;">
يمكنك التعديل على الزر كما تشاء: </div>
<div style="text-align: right;">
<span style="color: #6aa84f;">#68b12f <span style="color: black;">لون خلفية الزر.</span></span></div>
<div style="text-align: right;">
<span style="color: #990000;">CBF3AC</span><span style="color: #990000;"><span style="color: #990000;">#</span> <span style="color: black;">و </span></span><span style="color: #990000;"><span style="color: black;"><span style="color: #ea9999;">50911e</span></span></span><span style="color: #990000;"><span style="color: black;"><span style="color: #ea9999;"><span style="color: #990000;"><span style="color: black;"><span style="color: #ea9999;">#</span></span></span> <span style="color: black;">قد كررا عدة مرات، وهما تدرج اللون الخاص بالزر، من الأخضر الغامق إلى الفاتح.</span></span></span></span></div>
<div style="text-align: right;">
<span style="color: #990000;"><span style="color: black;"><span style="color: #ea9999;"><span style="color: black;"><span style="color: #f1c232;">#509111 <span style="color: black;">لون محيط الزر.</span></span></span></span></span></span></div>
<div style="text-align: right;">
<span style="color: #990000;"><span style="color: black;"><span style="color: #ea9999;"><span style="color: black;"><span style="color: #f1c232;"><span style="color: black;"><span style="color: red;">3px <span style="color: black;">مكرر عدة مرات، هو درجة إستدارة الزر.</span></span></span></span></span></span></span></span></div>
<div style="text-align: right;">
<span style="color: #6aa84f;"><span style="color: black;"><span style="color: #674ea7;">white <span style="color: black;">لون الكتابة على الزر.</span></span></span></span></div>
<div style="text-align: right;">
<span style="color: #6aa84f;"><span style="color: black;"><span style="color: #674ea7;"><span style="color: black;"><span style="color: #e69138;">CBF3AC# <span style="color: black;">و </span></span></span></span></span></span><span style="color: #6aa84f;"><span style="color: black;"><span style="color: #674ea7;"><span style="color: black;"><span style="color: #e69138;"><span style="color: black;"><span style="color: magenta;">50911e# <span style="color: black;">مكرر مرتين هو تدرج لون الزر عند تمرير الماوس.</span></span></span></span></span></span></span></span></div>
</div>
<div>
<ol style="text-align: right;">
</ol>
</div>
<div style="text-align: center;">
<h3>
طريقة الإستعمال</h3>
<div style="text-align: right;">
أثناء كتابتك للتدوينة و تريد أن تدرج رابط فقط قم بوضع هذا الكود:</div>
<blockquote class="tr_bq">
<div style="text-align: left;">
<a class="warch-button" href="<span style="color: red;"><b>#</b></span>"> <span style="color: #6aa84f;">إضغط هنا</span> </a></div>
</blockquote>
<div style="text-align: right;">
مكان الرمز"<span style="color: red;">#</span>" تكتب الرابط المراد إدراجه.<br />
مكان عبارة "<span style="color: #6aa84f;">إضغط هنا</span>" سوف تكتب أي شيئ مثلا "تحميل" أو "معاينة" و هكذا.<br />
أتمنى أن تستفيدوا في موضوع اليوم ، أي إستفسار أنا في الخدمة بالتوفيق للجميع في أمان الله.</div>
</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-32118494565424643692014-12-08T13:20:00.003-08:002015-11-17T03:08:13.677-08:00طريقة التضليل التلقائي لمحتوى الإقتباس في التدوينات <div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTISbH3lV0dBWhPXECQV6loT3U9LB5e6UAsDk92P6Su3hG7iH-iAp7W20y7txcpRniWYNvdINP8pfUjdua2L2D0-dIU7wL04-W1VnEMOZRN6NFvWi9lhNCxzdvsBdgV1se_9U28pippO8/s1600/make-auto-select-blockquote.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTISbH3lV0dBWhPXECQV6loT3U9LB5e6UAsDk92P6Su3hG7iH-iAp7W20y7txcpRniWYNvdINP8pfUjdua2L2D0-dIU7wL04-W1VnEMOZRN6NFvWi9lhNCxzdvsBdgV1se_9U28pippO8/s1600/make-auto-select-blockquote.png" /></a></div>
السلام عليكم ورحمة الله وبركاته.<br />
أداة الإقتباس من الأدوات التي يعتمدها المدونين في التحرير بكثرة ، ويكمن دورها في توضيح و تبين المحتوى المقتبس من النص الذي قام الكاتب أو المدون بكتابته. وتختلف أغراض هذا الإقتباس من موقع إلى أخر ، فهناك مواقع تهتم بقضايا إسلامية تستعمله للتفريق بين الأيات القرأنية، أو الأحاديث النبوية، و بين الكلام العادي. أما بالنسبة لمدونتي فأنا أستعمله لتميز الأكواد البرمجية من نص الشرح. وهكذا ، اليوم سنقوم بجعل المحتوى المقتبس سواء أيات أو أكواد يظلل بمجرد النقر عليه ضغطة واحدة فقط ، هذا يجعل ذلك المحتوى سهل النسخ و لن يتعبث الزائر، فأحيانا يجد البعض صعوبة في نسخ الأكواد المقتبسة ،فيظلل البعض و يبقى البعض وغيرها من المشاكل. المهم ننتقل للشرح .<br />
1- نذهب للوحة التحكم بلوجر ثم القالب يستحسن حفظ نسخة من القالب، بعد ذلك نقوم بتحرير html.<br />
2 - نقوم بالضغط و سط الأكواد ،ثم نضغط على الزرين ( crtl+f) ثم نبحث عن الوسم : <b><span style="color: blue;"></body></span></b><br />
3 - ثم ضع فوقه مباشرة هذا الكود:<br />
<blockquote class="tr_bq">
<div style="text-align: center;">
<script type='text/javascript'><br />
var pres = document.getElementsByTagName(&quot;blockquote&quot;);<br />
for (var i = 0; i &lt; pres.length; i++) {<br />
pres[i].addEventListener(&quot;<span style="color: red;">click</span>&quot;, function () {<br />
var selection = getSelection();<br />
var range = document.createRange();<br />
range.selectNodeContents(this);<br />
selection.removeAllRanges();<br />
selection.addRange(range);<br />
}, false);<br />
}<br />
</script></div>
</blockquote>
<div style="text-align: right;">
4 - قم بحفظ القالب.</div>
<div style="text-align: right;">
إذا رغبت في جعل محتوى الإقتباس يظلل بنقرتين أو دوبلكليك ، قم بإستبدال كلمة <span style="color: red;">click</span> الموجودة في الكود بي <span style="color: blue;">dblclick</span>.</div>
<div style="text-align: right;">
هذا كل ما في موضوع اليوم، أتمنى أن تستفيدو منه ، أي إستفسار أنا في الخدمة ، بالتوفيق للجميع ، في أمان الله.</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-82980164689455473192014-12-06T10:26:00.000-08:002014-12-06T10:26:08.968-08:00كيفة جعل خلفيات مدونتك بلوجر مختلفة حسب الصفحات <div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitJuyYlGhdZj_8_2USqbdrT3FkcWdPIufSDA2xnDQSLQuXvor7r2Cvs0qhhRChE4S9O___4Rge15Osq5wPbWFx0YAxkTYPEfM3hJVeErDz04yeR9MhPoOWnQPFtI2-pte-6Y4WGl6G4u8/s1600/%D8%AA%D8%BA%D9%8A%D8%B1+%D8%AE%D9%84%D9%81%D9%8A%D8%A7%D8%AA+%D8%A7%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitJuyYlGhdZj_8_2USqbdrT3FkcWdPIufSDA2xnDQSLQuXvor7r2Cvs0qhhRChE4S9O___4Rge15Osq5wPbWFx0YAxkTYPEfM3hJVeErDz04yeR9MhPoOWnQPFtI2-pte-6Y4WGl6G4u8/s1600/%D8%AA%D8%BA%D9%8A%D8%B1+%D8%AE%D9%84%D9%81%D9%8A%D8%A7%D8%AA+%D8%A7%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A9.png" /></a></div>
السلام عليكم و رحمة الله وبركاته.<br />
متابعي ورشة مدون الأوفياء في تدوينة اليوم سنتطرق إلى كيفية جعل خلفية مدونتك "background website" تتغير حسب صفحات مدونة بلوجر الخاصة بك ، هذه الإضافة تمكنك من إختار خلفية خاصة لأي صفحة إنطلاقا رابطها، و إعتمد في هذا الدرس الكود الرابع الذي شرحناه في <a href="http://warch-mo.blogspot.com/2014/11/show-dont-show-add-blogger.html" rel="" target="_blank">تدوينة التحكم في إخفاء و إظهار الأدوات</a>. عموما كي لا أطيل عليكم ننتقل إلى الشرح.<br />
<br />
<div style="text-align: center;">
<a href="http://test-add-blog.blogspot.com/2014/12/blog-post_6.html" rel="nofollow" target="_blank"><span style="font-size: large;"><b><span style="color: orange;">(((( معاينة الإضافة ))))</span></b></span></a> </div>
<br />
1- نذهب لوحة التحكم ثم قالب يفضل أخد نسخة إحتياطية للقالب حتى مع سهولة الدرس، بعد ذلك إنقر على تحرير html .<br />
2 - إنقر وسط الأكواد ثم إبحث عن الوسم : <b><span style="color: blue;"></head></span></b> بالإستعانة بالزرين ctrl+f .<br />
3 - ضع هذا الكود فوقه مباشرة:<br />
<blockquote class="tr_bq">
<div style="text-align: center;">
<b:if cond='data:blog.url == &quot;<span style="color: red;">http://warch-mo.blogspot.com</span>&quot;'><br />
<style><br />
body {<br />
background-image: url(<span style="color: blue;">رابط الخلفية المباشر</span>);<br />
background-position: center;<br />
background-repeat: repeat;<br />
background-attachment: fixed;<br />
}<br />
</style><br />
</b:if></div>
</blockquote>
<div style="text-align: center;">
مكان الرابط <span style="color: red;">الأحمر</span> ضع رابط الصفحة الذي تريد تخصيصه بخلفية معينة. <br />
مكان عبارة "<span style="color: blue;">رابط الخلفية المباشر</span>" ضع رابط الصورة أو الخلفية التي تحب.<br />
يمكنك تكرار وضع الكود عدة مرات مع تغير الروابط دائما بما يناسبك.<br />
كما يمكنك جعل للصفحات التابثة خلفية موحدة و لصفحات المواضيع خلفية أخرى موحدة . فقط قم بزيارة <a href="http://test-add-blog.blogspot.com/2014/12/blog-post_6.html" target="_blank">موضوع إخفاء و إظهار أدوات بلوجر</a> لتعلم أكثر طريقة العمل. <br />
<br />
<b><span style="color: #38761d;">هذه بعض الخلفيات إن أعجبتكم </span></b><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyaddFbiVLQPq8-SQD8wwxnBefuElDmr9_C_6zeO7OBHEvPN50VchhnCeNgMNYqq6oKz1tbDInZpdwPEZUdT_dWL8bEUMEVBEHNdleJZHWq2g00aAWzsWayuKXk1pwrsxyEj54bvC6X9w/s1600/summer_9-wallpaper-1920x1200.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXmVag4zDkhk7aL47O9ufBHVV2LQ1eohZGxTAmfio19LQpooYbxN2xSVm0JUcXbZZcxE0E2_-cDVssCuXXFpD5_P7D54FvspAXueldVjg3mGmnv0Wt64ItvG109ekgk21S7HO_pOJMS1Y/s1600/poppies_meadow-wallpaper-2400x1350.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXmVag4zDkhk7aL47O9ufBHVV2LQ1eohZGxTAmfio19LQpooYbxN2xSVm0JUcXbZZcxE0E2_-cDVssCuXXFpD5_P7D54FvspAXueldVjg3mGmnv0Wt64ItvG109ekgk21S7HO_pOJMS1Y/s1600/poppies_meadow-wallpaper-2400x1350.jpg" height="112" width="200" /></a><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyaddFbiVLQPq8-SQD8wwxnBefuElDmr9_C_6zeO7OBHEvPN50VchhnCeNgMNYqq6oKz1tbDInZpdwPEZUdT_dWL8bEUMEVBEHNdleJZHWq2g00aAWzsWayuKXk1pwrsxyEj54bvC6X9w/s1600/summer_9-wallpaper-1920x1200.jpg" height="125" width="200" /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbfyw7AtO6JbD5j_blZp9zwM1UeHU9X4aubHySglmJFLqpDanY8G-fhmoU1aBcjC4UhnzKdkl7eNFZkAK9OQE5Blkn-PZBAZwyLT4wNIfjkv4iBO0nR-Oi3AcnDcubnKrUoG-Uf6LLSzo/s1600/warm+sunset+wallpaper.jpg" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbfyw7AtO6JbD5j_blZp9zwM1UeHU9X4aubHySglmJFLqpDanY8G-fhmoU1aBcjC4UhnzKdkl7eNFZkAK9OQE5Blkn-PZBAZwyLT4wNIfjkv4iBO0nR-Oi3AcnDcubnKrUoG-Uf6LLSzo/s1600/warm+sunset+wallpaper.jpg" height="125" width="200" /></a></div>
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiim3x5lUjGoOEzPS4_VtlzdgDDxXG7U3qnxD5pecqLkncy4pJ8BfDzgEkY7ot26MhERU336yyHwWtft6E6-yVmV7AjrHPNOTQdbzdEbo_dk8Is9G50tO0stHjTsDnHwdJ63kPwXpHvZwE/s1600/bkgd_pattern.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiim3x5lUjGoOEzPS4_VtlzdgDDxXG7U3qnxD5pecqLkncy4pJ8BfDzgEkY7ot26MhERU336yyHwWtft6E6-yVmV7AjrHPNOTQdbzdEbo_dk8Is9G50tO0stHjTsDnHwdJ63kPwXpHvZwE/s1600/bkgd_pattern.png" height="200" width="200" /></a></div>
هذا كل ما في موضوع اليوم، أي إستفسار أنا في الخدمة، بالتوفيق للجميع دمتم بود في أمان الله.</div>
</div>
Unknownnoreply@blogger.com1tag:blogger.com,1999:blog-8722635733075134433.post-19878049689520089732014-12-06T07:20:00.001-08:002014-12-06T07:20:56.558-08:00إنشاء خريطة لموقعك أو مدونتك (الفهرس)<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimkgTal309zmAt6wB5ZjURRORDXNyAPyKi_jtXawVOiIAX9VIympRV5-Yu48bXY_6sbb3yIbFZtKegnkVEGCdCd5UKP5NM2ZwoXgLSO0HP-DfXqapCtzhectyZ8WCksA_qETMf7AfL6cU/s1600/%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D8%A3%D8%B1%D8%B4%D9%8A%D9%81+%D9%84%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimkgTal309zmAt6wB5ZjURRORDXNyAPyKi_jtXawVOiIAX9VIympRV5-Yu48bXY_6sbb3yIbFZtKegnkVEGCdCd5UKP5NM2ZwoXgLSO0HP-DfXqapCtzhectyZ8WCksA_qETMf7AfL6cU/s1600/%D8%A5%D9%86%D8%B4%D8%A7%D8%A1+%D8%A3%D8%B1%D8%B4%D9%8A%D9%81+%D9%84%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A9.png" /></a></div>
السلام عليكم ورحمة الله وبركاته.<br />
يعتبر <a href="http://warch-mo.blogspot.com/2014/12/site-index-blog.html" target="_blank">إنشاء صفحة الفهرس</a> من بين الأداوت التي تسهل على الزوار التنقل بين مواضيع المدونة ، خصوصا الاصناف التي يحب أن يتابعها أو المواضيع الذي يبحث عنها. فهذه صفحة تكون بمثابة أرشيف لمدونة ، ومن خلالها تتكزن نظرة للزوار عن كل ما بمدونتك من محتوى، و ما يميز هذا الفهرس هو أنه يبين للزائر المواضيع الجديد في المدونة في حدود شهر تقريبا.<br />
<br />
<div style="text-align: center;">
<a href="http://warch-mo.blogspot.com/p/blog-page.html" target="_blank"><span style="font-size: large;"><b><span style="color: orange;">(((( معاينة فهرس المدونة )))))</span></b></span></a></div>
<br />
<div style="text-align: center;">
<blockquote class="tr_bq">
<div dir="rtl" style="text-align: center;" trbidi="on"><br />
<style><br />
p.labels a{color: #242424; text-transform: uppercase;font-size: 15px;}<br />
a.post-titles {color: #0000FF;}<br />
ol li{list-style-type:decimal;line-height:25px;}<br />
</style><br />
<script><br />
//<![CDATA[<br />
var postTitle=new Array();var postUrl=new Array();var postPublished=new Array();var postDate=new Array();var postLabels=new Array();var postRecent=new Array();var sortBy="titleasc";var tocLoaded=false;var numChars=250;var postFilter="";var numberfeed=0;function bloggersitemap(a){function b(){if("entry" in a.feed){var d=a.feed.entry.length;numberfeed=d;ii=0;for(var h=0;h<d;h++){var n=a.feed.entry[h];var e=n.title.$t;var m=n.published.$t.substring(0,10);var j;for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="alternate"){j=n.link[g].href;break}}var o="";for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="enclosure"){o=n.link[g].href;break}}var c="";if("category" in n){for(var g=0;g<n.category.length;g++){c=n.category[g].term;var f=c.lastIndexOf(";");if(f!=-1){c=c.substring(0,f)}postLabels[ii]=c;postTitle[ii]=e;postDate[ii]=m;postUrl[ii]=j;postPublished[ii]=o;if(h<10){postRecent[ii]=true}else{postRecent[ii]=false}ii=ii+1}}}}}b();sortBy="titleasc";sortPosts(sortBy);sortlabel();tocLoaded=true;displayToc2();document.write('</br>')}function filterPosts(a){scroll(0,0);postFilter=a;displayToc(postFilter)}function allPosts(){sortlabel();postFilter="";displayToc(postFilter)}function sortPosts(d){function c(e,g){var f=postTitle[e];postTitle[e]=postTitle[g];postTitle[g]=f;var f=postDate[e];postDate[e]=postDate[g];postDate[g]=f;var f=postUrl[e];postUrl[e]=postUrl[g];postUrl[g]=f;var f=postLabels[e];postLabels[e]=postLabels[g];postLabels[g]=f;var f=postPublished[e];postPublished[e]=postPublished[g];postPublished[g]=f;var f=postRecent[e];postRecent[e]=postRecent[g];postRecent[g]=f}for(var b=0;b<postTitle.length-1;b++){for(var a=b+1;a<postTitle.length;a++){if(d=="titleasc"){if(postTitle[b]>postTitle[a]){c(b,a)}}if(d=="titledesc"){if(postTitle[b]<postTitle[a]){c(b,a)}}if(d=="dateoldest"){if(postDate[b]>postDate[a]){c(b,a)}}if(d=="datenewest"){if(postDate[b]<postDate[a]){c(b,a)}}if(d=="orderlabel"){if(postLabels[b]>postLabels[a]){c(b,a)}}}}}function sortlabel(){sortBy="orderlabel";sortPosts(sortBy);var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];firsti=a;do{a=a+1}while(postLabels[a]==temp1);b=a;sortPosts2(firsti,a);if(b>postTitle.length){break}}}function sortPosts2(d,c){function e(f,h){var g=postTitle[f];postTitle[f]=postTitle[h];postTitle[h]=g;var g=postDate[f];postDate[f]=postDate[h];postDate[h]=g;var g=postUrl[f];postUrl[f]=postUrl[h];postUrl[h]=g;var g=postLabels[f];postLabels[f]=postLabels[h];postLabels[h]=g;var g=postPublished[f];postPublished[f]=postPublished[h];postPublished[h]=g;var g=postRecent[f];postRecent[f]=postRecent[h];postRecent[h]=g}for(var b=d;b<c-1;b++){for(var a=b+1;a<c;a++){if(postTitle[b]>postTitle[a]){e(b,a)}}}}function displayToc(a){var l=0;var h="";var e="Post Title";var m="Click to sort by title";var d="Date";var k="Click to sort by date";var c="Category";var j="";if(sortBy=="titleasc"){m+=" (descending)";k+=" (newest first)"}if(sortBy=="titledesc"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="dateoldest"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="datenewest"){m+=" (ascending)";k+=" (oldest first)"}if(postFilter!=""){j="Click to view all"}h+="<table>";h+="<tr>";h+='<td class="header1">';h+='<a href="javascript:toggleTitleSort();" title="'+m+'">'+e+"</a>";h+="</td>";h+='<td class="header2">';h+='<a href="javascript:toggleDateSort();" title="'+k+'">'+d+"</a>";h+="</td>";h+='<td class="header3">';h+='<a href="javascript:allPosts();" title="'+j+'">'+c+"</a>";h+="</td>";h+='<td class="header4">';h+="Read all";h+="</td>";h+="</tr>";for(var g=0;g<postTitle.length;g++){if(a==""){h+='<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>';l++}else{z=postLabels[g].lastIndexOf(a);if(z!=-1){h+='<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>';l++}}}h+="</table>";if(l==postTitle.length){var f='<span class="toc-note">Show All '+postTitle.length+" Posts<br/></span>"}else{var f='<span class="toc-note">Show '+l+" posts by category '";f+=postFilter+"' the "+postTitle.length+" Total Posts<br/></span>"}var b=document.getElementById("toc");b.innerHTML=f+h}function displayToc2(){var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];document.write("<p/>");document.write('<p class="labels"><a href="/search/label/'+temp1+'">'+temp1+"</a></p><ol>");firsti=a;do{document.write("<li>");document.write('<a class="post-titles" href="'+postUrl[a]+'">'+postTitle[a]+"</a>");if(postRecent[a]==true){document.write(' - <strong><span style="color: rgb(255, 0, 0);">جديد!</span></strong>')}document.write("</li>");a=a+1}while(postLabels[a]==temp1);b=a;document.write("</ol>");sortPosts2(firsti,a);if(b>postTitle.length){break}}}function toggleTitleSort(){if(sortBy=="titleasc"){sortBy="titledesc"}else{sortBy="titleasc"}sortPosts(sortBy);displayToc(postFilter)}function toggleDateSort(){if(sortBy=="datenewest"){sortBy="dateoldest"}else{sortBy="datenewest"}sortPosts(sortBy);displayToc(postFilter)}function showToc(){if(tocLoaded){displayToc(postFilter);var a=document.getElementById("toclink")}else{alert("Just wait... TOC is loading")}}function hideToc(){var a=document.getElementById("toc");a.innerHTML="";var b=document.getElementById("toclink");b.innerHTML='<a href="#" onclick="scroll(0,0); showToc(); Effect.toggle(\'toc-result\',\'blind\');">?? Display Table of Contents</a> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZJc_1Qcgo2WAx1-lg5kLUQNLhw_Jx27r3Kx2FCJuaSSkkOS5BTxoc1SlEgWLgXFevj-q7jvPiialBfsYLUmWb5V4RPotHwKVh3iO4ymSSJYVrGqjTNJYXTwiT5DbVgrAI0XkvCQbwslLq/s1600/new_icon.gif"/>'}function looptemp2(){for(var a=0;a<numberfeed;a++){document.write("<br>");document.write('Post Link : <a href="'+postUrl[a]+'">'+postTitle[a]+"</a><br>");document.write('Read all : <a href="'+postPublished[a]+'">'+postTitle[a]+"</a><br>");document.write("<br>")}};<br />
//]]><br />
</script><br />
<script src="<b><span style="color: red;">http://warch-mo.blogspot.com</span></b>/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=bloggersitemap"></script><br />
</div></blockquote>
</div>
<div style="text-align: center;">
لا تنسى تغير رابط مدونتي بالرابط الخاص بك.<br />
هذا كل ما في تدوينة اليوم، أي إستفسار أنا في الخدمة ، بالتوفيق للجميع في أمان الله.</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-45993822863521360602014-12-06T04:04:00.000-08:002014-12-06T05:41:31.898-08:00أزرار ببرمجة css3 لمشاركة المواضيع على مواقع الإجتماعية. <div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8u0Q7LY46tfA-t4R9Ebj3xSeb9T6lv2TIKsxjQmDKaqmhFLBkUYs7bo9aADH1cGCLjLA_jCZ8eDROCnheTKs_fAv76HrKqLHGGt30BFbbHMcokeN2bQ922_sTHABATmnjm2WoQ3D3osM/s1600/%D8%A3%D8%B2%D8%B1%D8%A7%D8%B1+%D8%A7%D9%84%D9%85%D8%B4%D8%A7%D8%B1%D9%83%D8%A9+%D8%A7%D9%84%D8%A5%D8%AC%D8%AA%D9%85%D8%A7%D8%B9%D9%8A%D8%A9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8u0Q7LY46tfA-t4R9Ebj3xSeb9T6lv2TIKsxjQmDKaqmhFLBkUYs7bo9aADH1cGCLjLA_jCZ8eDROCnheTKs_fAv76HrKqLHGGt30BFbbHMcokeN2bQ922_sTHABATmnjm2WoQ3D3osM/s1600/%D8%A3%D8%B2%D8%B1%D8%A7%D8%B1+%D8%A7%D9%84%D9%85%D8%B4%D8%A7%D8%B1%D9%83%D8%A9+%D8%A7%D9%84%D8%A5%D8%AC%D8%AA%D9%85%D8%A7%D8%B9%D9%8A%D8%A9.png" /></a></div>
السلام عليكم و رحمة الله وبركاته.<br />
أزرار مشاركة مواضيع أو تدوينات المدونة، تمكن الزائر من مشاركة المواضيع التي يراها مهمة حتى يرجع إليها ثانية أو من أجل إفادة أصقائه بالموضوع، و هذا أيضا يرجع على صاحب المدونة بالنفع حيث سيتمكن من نشر مواضيعه على نطاق واسع ، و بذلك سيستقطب الزوار من مختلف المواقع الإجتماعية التي نعلم فضلها اليوم على المواقع و مدونات .<br />
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<a href="http://test-add-blog.blogspot.com/2014/12/12.html" rel="nofollow" target="_blank"><span style="font-size: large;"><b><span style="color: orange;">((((~~ معاينة ~~ ))))</span></b></span></a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
الأن طريقة التركيب:</div>
1- نذهب لوحة التحكم البلوجر ثم قالب يفضل أخد نسخة إحتياطية للقالب حتى مع سهولة الدرس، بعد ذلك إنقر على تحرير html .<br />
2 - إنقر وسط الأكواد ثم إبحث عن الوسم : <b><span style="color: blue;">]]></b:skin></span></b> بالإستعانة بالزرين ctrl+f .<br />
3 - ضع هذا الكود فوقه مباشرة :<br />
<div style="text-align: center;">
<blockquote class="tr_bq">
.share_button {<br />
width: 300px;<br />
height: 50px;<br />
margin: 10px auto;<br />
}<br />
.share_button ul {<br />
width: 50%;<br />
height: inherit;<br />
float: left;<br />
list-style: none;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
}<br />
.share_button ul h1 {<br />
margin-top: 9%;<br />
overflow: hidden;<br />
width: 100%;<br />
color: #4889F0;<br />
font-size: 18px;<br />
text-shadow:2px 2px 2px #fff;<br />
}<br />
.share_button ul li {<br />
position: absolute;<br />
height: inherit;<br />
width: 150px;<br />
margin: 0 !important;<br />
padding: 0 !important;<br />
background: #EEEEEE;<br />
-webkit-transition: all 600ms;<br />
-moz-transition: all 600ms;<br />
-o-transition: all 600ms;<br />
-ms-transition: all 600ms;<br />
transition: all 600ms;<br />
text-align: center;<br />
}<br />
.share_button ul li h2 {<br />
display: inline-block;<br />
width: 32%;<br />
height: 40px;<br />
overflow: hidden;<br />
margin-top: 5%;<br />
cursor: pointer;<br />
border: 0 !important;<br />
}<br />
.share_button ul:first-child li:first-child{<br />
text-align: right;<br />
}<br />
.share_button ul:last-child li:first-child{<br />
text-align: left;<br />
}<br />
.share_button ul:first-child li:last-child,<br />
.share_button:hover ul:first-child li:first-child {<br />
-webkit-transform: rotateY(90deg);<br />
-moz-transform: rotateY(90deg);<br />
-o-transform: rotateY(90deg);<br />
-ms-transform: rotateY(90deg);<br />
transform: rotateY(90deg);<br />
}<br />
.share_button ul:last-child li:last-child,<br />
.share_button:hover ul:last-child li:first-child {<br />
-webkit-transform: rotateY(-90deg);<br />
-moz-transform: rotateY(-90deg);<br />
-o-transform: rotateY(-90deg);<br />
-ms-transform: rotateY(-90deg);<br />
transform: rotateY(-90deg);<br />
}<br />
.share_button:hover ul:first-child li:last-child,<br />
.share_button:hover ul:last-child li:last-child {<br />
-webkit-transform: rotateY(0deg);<br />
-moz-transform: rotateY(0deg);<br />
-o-transform: rotateY(0deg);<br />
-ms-transform: rotateY(0deg);<br />
transform: rotateY(0deg);<br />
}</blockquote>
</div>
<div style="text-align: right;">
4 - الأن أكواد الهيكلة نقوم بالبحث عن هذا الكود : <b><span style="color: blue;"><data:post.body/> </span></b><span style="color: blue;"><span style="color: black;">غالبا ستجده مكرر مرتين أو أكثر الثاني هو المقصود ، فحالة إن تعذر معك الأمر يمكنك الإستعانة بأكواد الكاتب أو شيء من هذا القبيل فقم مثلا بوضعه فوق أكواد الكاتب مثلا.</span></span></div>
<div style="text-align: right;">
5 - نضع تحته مباشرة الكود التالي : </div>
<div style="text-align: center;">
<br /><br /><blockquote class="tr_bq">
<b:if cond='data:blog.pageType == &quot;item&quot;'><br /> <div class='share_button'> <br /><ul><br /><li><h1><br />الموضوع!!<br /></h1></li><br /><li><h2><br /><a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.canonicalUrl + &quot;&amp;t=&quot; + data:post.title ' title='Share on Facebook'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaKNWQTts044dnB1WclURaoMHGuYI7rAPN8HHa4oo_xfsKm5v-gAHR98SB_HrvUGz_3Sj_AgLn4UR99wfgdkVlJud-L84XuwWD4KO4QmJnEdZMoQLG3tCrBN8JcMIX-V5MsWzf-vvkOTQf/s1600/Facebook.png"/></a></h2><br /><h2><a expr:href='&quot;http://twitter.com/home?status=&quot; + data:post.title + &quot; &quot; + data:post.canonicalUrl ' title='Share on Twitter'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjf8NkNFtSEGvFUD7b_RnPhqCcWWb1gPtg9oW2bcREHPcllhYK1UZlvWa1RGQoAQ5EdALvIvQLuh_Wdo2cAwWpTMyWIUoYWoZtEGNmKzD3dGOj7uN9KFGM6LN2xylCSaFzbxSRsk7MbweK2/s1600/Twitter.png"/></a></h2><br /></li><br /></ul><br /><ul><br /><li><h1>شارك </h1></li><br /><li><br /><h2><a expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.canonicalUrl ' title='Share on Google Plus'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOxbawRZxt8Eutw_SUFfTUYDfHyuaK860oZLVj-4V6XnVZHYteQBHfz2J2Bons7s0A_EvoikXANeAFvnBA5cLsK3NMEB_yJA7zPYyg4dbxWeil5_cJ9OoExRSFKDIW4hAovhBgl-K0BtuY/s1600/Google-plus.png"/></a></h2><br /><h2><br /><a href='javascript:void((function(){var%20e=document.createElement(&apos;script&apos;);e.setAttribute(&apos;type&apos;,&apos;text/javascript&apos;);e.setAttribute(&apos;charset&apos;,&apos;UTF-8&apos;);e.setAttribute(&apos;src&apos;,&apos;http://assets.pinterest.com/js/pinmarklet.js?r=&apos;+Math.random()*99999999);document.body.appendChild(e)})());' title='Share on Pinterest'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZoTdMBK81kCAvF1TLpnVwC6G-CCL_ySf8Fo7zJQP3yxyrq3EAr8blfy_JsTcEbHqq52TGYIUjM4ZJeyZcDKPp5ZX3K5btG818PNM0ptbmBohuZLA30iJxpCs9E80_mSqH9OZXRQ0_e87n/s1600/Pinterest.png"/></a><br /></h2><br /></li><br /></ul><br /></div></b:if></blockquote>
هذا كل ما في موضوع اليوم أي تسائل إترك تعليق، بالتوفيق للجميع في أمان الله.</div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-8722635733075134433.post-87514659220338805862014-12-06T03:16:00.001-08:002014-12-06T03:32:34.001-08:00كيفية جعل المحتوى أو جزء منه مغلق في مدونة بلوجر<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW-fDF_DcbIoNtDoAmcCBZeGTqf0rDFiNvieS1YxXzNwHwuz_HRjn-VV2Wm9PdMpew_XYP7VQuwzhTwWKe8vNMwWwQl9nGpR-1OI7Y6qmwgWCOy0UIWq0yEfsjv6TcOdzj-AObkmA2vO0/s1600/sociel-locked.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW-fDF_DcbIoNtDoAmcCBZeGTqf0rDFiNvieS1YxXzNwHwuz_HRjn-VV2Wm9PdMpew_XYP7VQuwzhTwWKe8vNMwWwQl9nGpR-1OI7Y6qmwgWCOy0UIWq0yEfsjv6TcOdzj-AObkmA2vO0/s1600/sociel-locked.png" /></a></div>
السلام عليكم و رحمة الله وبركاته .<br />
هل تريد كسب مهتمين ومتابعين ؟! هل تريد نشر مواضيعك بأكبر نسبة ممكنة في مواقع التواصل الإجتماعية، اليوم لك كل ما تريد ، كما نعلم منصة البلوجر كل يوم تزداد قاعدة مستخدميها، مما يجعلنا دائما مواكبين لجديد تطوراتها من أجل إثبات أنها <a href="http://warch-mo.blogspot.com/2014/11/Blogger-Vs-Wordpress.html" target="_blank">أفضل منصة للتدوين</a>، درس اليوم عبارة عن أدآة إحترافية تمكنك من إخفاء محتوي تدويناتك أو جزء منه ، و ذلك بإظهار لوحة أو بطاقة تعلم الزوار بأن المحتوى مغلق و تخبره بأن يستعمل أحد أزرار المواقع الأجتماعية من أجل أن يستطيع رؤية محتوى التدوينة.<br />
في الحقيقة هذه الآداة إحترافية و كما ذكرنا سابقا في <a href="http://warch-mo.blogspot.com/2014/06/box-like-POP-UP-for-blogger.html" target="_blank">تدوينة صندوق الإعجابات المنبتق</a>، فهذا النوع من الإظافات يكرهها الزوار و لكن إن كان موقعك مميز و يقدم أشياء لا يمكن للزوار الإستغناء عنها ولا إيجادها في في مكان أخر، فهم حتما سيتحملون ذلك و أصلا سوف يقومون بمشاركة مواضيعك. الأهم من ذلك يجب أن تتعامل بذكاء معها و تعرف ما ستستعملها و متى لا يجب إستعمالها.<br />
هذه الأداة تعتبر أفضل من النوافذ المنبقة التي تخفي الصفحة بأكملها لتجبر الزوار على الإعجابات و غيرها ، فأداة المحتوى مغلق هذه تستطيع تكرارها في صفحة واحدة وما يميزها هي<br />
وما يميز هذه الإضافة هي أنها متوفرة بأشكال متنوعة مع إمكانية تغير و <a href="http://warch-mo.blogspot.com/2014/03/add-social-shere-blogger.html" target="_blank">إضافة أزرار المشاركة الإجتماعية</a> التي تريد.<br />
<div style="text-align: center;">
<br />
<a href="http://test-add-blog.blogspot.com/2014/12/blog-post.html" rel="nofollow" target="_blank"><span style="font-size: large;"><b><span style="color: orange;">((((( ~~ معاينة ~~)))))</span></b></span></a></div>
<div style="text-align: center;">
الأن طريقة تركيب الإضافة.</div>
<div style="text-align: right;">
1 - إذهب للوحة التحكم بلوجر ثم القالب نقوم بحفظ نسخة إحتياطية تفاديا لأي مشكل محتمل</div>
<div style="text-align: right;">
2 - قم بتحرير html .</div>
<div style="text-align: right;">
3 - إنقر وسط الأكواد ثم إبحث مستعينا بالزرين ( ctrl+f ) على الوسم : <span style="color: blue;"><b><head></b></span></div>
<div style="text-align: right;">
4 - ضع هذا الكود أسفله مباشرة في حالة كان قالبك لا يتوفر على مكتبة جيكوري، أما إن كان به فلا داعي لوضعه .</div>
<blockquote class="tr_bq">
<div style="text-align: center;">
<span style="color: #990000;"><b><script src='http://code.jquery.com/jquery-1.10.2.min.js' type='text/javascript'/></b></span></div>
</blockquote>
<div style="text-align: right;">
5 - إبحث مستعينا بالزرين ( ctrl+f ) على الوسم : <span style="color: blue;"><b></head></b></span> ثم ضع الكود التالي فوقه مباشرة . </div>
<blockquote class="tr_bq">
<div style="text-align: left;">
<link href='https://sites.google.com/site/warchatmo/code/sociallocker_v1.6.0-1.css' rel='stylesheet'/><br />
<script src='https://sites.google.com/site/warchatmo/code/sociallock.js' type='text/javascript'/><br />
<script type='text/javascript'><br />
//<![CDATA[<br />
jQuery(document).ready(function ($) {<br />
$('#default-usage .to-lock').sociallocker({<br />
<br />
buttons: {order:[<span style="color: #f1c232;">"facebook-like"</span>,<span style="color: #f1c232;">"twitter-tweet"</span>,<span style="color: #f1c232;">"</span><span style="color: #f1c232;"><span style="color: #f1c232;">google-plus</span>"</span>]},<br />
<br />
twitter: {url:"<span style="color: blue;">http://twitter.com/MohtofbiX</span>"},<br />
facebook: {url:"<span style="color: blue;">https://www.facebook.com/warch.mo</span>"},<br />
google: {url:"<span style="color: blue;">https://plus.google.com/104753369012716009644</span>"},<br />
<br />
text: {<br />
header: "<span style="color: red;">الموضوع مغلق</span>",<br />
message: "<span style="color: red;">الموضوع مغلق، إستعمل أحد أزرار المواقع الإجتماعية لتتمكن من رؤية المحتوى</span>."<br />
},<br />
<br />
locker: {close: <span style="color: magenta;">false</span>, timer: <span style="color: #e69138;">0</span>,},<br />
theme: "<span style="color: lime;">secrets</span>"<br />
});<br />
});<br />
//]]><br />
</script></div>
</blockquote>
<div style="text-align: right;">
الأن بعض التعديلات على الكود.</div>
<div style="text-align: right;">
الروابط <span style="color: blue;">الزرقاء</span> قم بتغيرها بالروابط الخاصة بك.</div>
<div style="text-align: right;">
العبارات <span style="color: red;">الحمراء</span> يمكنك تغيرها بما يناسبك.</div>
<div style="text-align: right;">
الكلمة <span style="color: magenta;">false</span> تعني عدم إظهار زر <span style="color: red;">X</span> الذي عبره يتمكن الزائر من إخفاء تلك اللوحة و رؤية المحتوى بدون النقر على الأزرار الإجتماعية، قم بتغيرها بـ <span style="color: #674ea7;">true</span> إن أردت الزر أن يظهر.</div>
<div style="text-align: right;">
<span style="color: #e69138;">0 <span style="color: black;">هو عدد ثواني بقاء اللوحة مغلقة حتى تفتح تلقائيا.</span></span></div>
<div style="text-align: right;">
<span style="color: #f1c232;">"facebook-like"</span> و <span style="color: #f1c232;">"twitter-tweet"</span> و <span style="color: #f1c232;">"google-plus"</span> تعني نوع الأزرار التي بالوحة و يمكنك تغيرها أو إضافة أخرى.</div>
<div style="text-align: right;">
الأزرار الممكن إستخدامها هي:</div>
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglS7IA6P3TXpKRogO-w1D4sKA-2NxBl0xpP5aE9FWUnewrqCStcFZ3Fy51DcktHWpqVpDe6n81eYffJpS-6-5oolwZqm8D4eFiDEHrY5ExeEt3qstmlnIlGCh_b3ChTxO5UfQX10ktT-U/s1600/like.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglS7IA6P3TXpKRogO-w1D4sKA-2NxBl0xpP5aE9FWUnewrqCStcFZ3Fy51DcktHWpqVpDe6n81eYffJpS-6-5oolwZqm8D4eFiDEHrY5ExeEt3qstmlnIlGCh_b3ChTxO5UfQX10ktT-U/s1600/like.png" /></a> "facebook-like" </div>
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1Obq2g9M7GWsTrcG48meuU0U0vIznTJ9rHr_bDxXPAhY9wLvHhMCRuzsxHRkWQmxEEtsgldwxeDCsN3Fok8KCRtM-6PdBzY4TUQfgpjH1BVVONVkEwpXrObo6FRzipchDYApAzi0LSB8/s1600/shire.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1Obq2g9M7GWsTrcG48meuU0U0vIznTJ9rHr_bDxXPAhY9wLvHhMCRuzsxHRkWQmxEEtsgldwxeDCsN3Fok8KCRtM-6PdBzY4TUQfgpjH1BVVONVkEwpXrObo6FRzipchDYApAzi0LSB8/s1600/shire.png" /></a> "facebook-share"</div>
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1tz7DeTzhe-40izpzvgKzZfbaQjWml_nxPQenUzjqbznlLIPpNyrIrOVOxUUlXzgvSmD5KMDQ71q5Bc3LYqzxhyDSYKAasNJ6UsJZu3PAApnW1qVknJIU7FzFj0ZevCmrjI0LN0FJo5A/s1600/1plus.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1tz7DeTzhe-40izpzvgKzZfbaQjWml_nxPQenUzjqbznlLIPpNyrIrOVOxUUlXzgvSmD5KMDQ71q5Bc3LYqzxhyDSYKAasNJ6UsJZu3PAApnW1qVknJIU7FzFj0ZevCmrjI0LN0FJo5A/s1600/1plus.png" /></a> "google-plus" </div>
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiprXbXOk2yt_8-EfyXruEXQVnA6t0Ee_Mr0WLR3rFixxq-mOKf8B0Fw1phCczvgywGYDrSF9-PB3hKyJakhMgu_WUVhS8FDvm2tnD61OTmsm96s-0XTGSmlt7YuksTf8-gr0ds9w3bXXs/s1600/shi+go.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiprXbXOk2yt_8-EfyXruEXQVnA6t0Ee_Mr0WLR3rFixxq-mOKf8B0Fw1phCczvgywGYDrSF9-PB3hKyJakhMgu_WUVhS8FDvm2tnD61OTmsm96s-0XTGSmlt7YuksTf8-gr0ds9w3bXXs/s1600/shi+go.png" /></a> "google-share" </div>
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjR3rLWdUTSJr9MxzhCJZeotHcxEfbgjSIz6X0u3jBPXxWUoq8ShCKkaKsWTiPBQ3cuMDq957xLh5E52y6GAyT11CqdVJsDXpPLKUu888RbXfVaVerETabS-SiCKKAtBfFffq57Oyedc1g/s1600/twi.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjR3rLWdUTSJr9MxzhCJZeotHcxEfbgjSIz6X0u3jBPXxWUoq8ShCKkaKsWTiPBQ3cuMDq957xLh5E52y6GAyT11CqdVJsDXpPLKUu888RbXfVaVerETabS-SiCKKAtBfFffq57Oyedc1g/s1600/twi.png" /></a> "twitter-tweet" </div>
<div style="text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQPxTa-v51GkAz20smbkHJEgXJQHaKB3qexcXSDwTmt2KRMGcfKBORqaWsq9yDw3CVmuwL0n0vqQapAy7hqXljIatSU0C2wipvN39T6MGlE_gy92K_Gtc0n6mqHq4iOiHECuYNLbEMdN4/s1600/si+in.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQPxTa-v51GkAz20smbkHJEgXJQHaKB3qexcXSDwTmt2KRMGcfKBORqaWsq9yDw3CVmuwL0n0vqQapAy7hqXljIatSU0C2wipvN39T6MGlE_gy92K_Gtc0n6mqHq4iOiHECuYNLbEMdN4/s1600/si+in.png" /></a> "linkedin-share"</div>
<div style="text-align: right;">
<br /></div>
<div style="text-align: right;">
الكلمة <span style="color: lime;">secrets</span> الثيم أو ستايل اللوحة يمكنك تغيرها حسب النمادج التالية:<br />
<div style="text-align: center;">
1): <b>dandyish</b></div>
<div style="text-align: center;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTJKAY6HYPwuqVFq19utYxp7DQ3-oxaSC6mTKklrIcHKSqEOtzMgM1ylWnNQpKFIOsLkTZ4xsq41TWNz3M8p3-nuqhfY8ehjUpU6Ps_GOZRoK8Aorix8CoN4nvRcBWaOi4sY0gyJcQnAE/s1600/dandyish.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTJKAY6HYPwuqVFq19utYxp7DQ3-oxaSC6mTKklrIcHKSqEOtzMgM1ylWnNQpKFIOsLkTZ4xsq41TWNz3M8p3-nuqhfY8ehjUpU6Ps_GOZRoK8Aorix8CoN4nvRcBWaOi4sY0gyJcQnAE/s1600/dandyish.PNG" /></a></div>
2): <b>flat</b><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwIIMASm29MxWAIhRAvcy6vc-2mx22dkbdDQFDCJqh6njrJqzsD80KdI9lD6_E0URxxo2cDhwx1q4Bhy8z0hWkMEY5MXZ78RSYnBy6rzq17_4gNmrWvbbKsA1KreyUXwYLc847kfsL7P8/s1600/flat.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwIIMASm29MxWAIhRAvcy6vc-2mx22dkbdDQFDCJqh6njrJqzsD80KdI9lD6_E0URxxo2cDhwx1q4Bhy8z0hWkMEY5MXZ78RSYnBy6rzq17_4gNmrWvbbKsA1KreyUXwYLc847kfsL7P8/s1600/flat.PNG" /></a></div>
3): <b>glass</b><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-3YtR4Luy2-N_D7IPSWkaTg45NvDTShYUro9MR6tH5PneK6n_4oGo71CuNmeZKD_YwWMsdjrdf0-fM8J1sja0Ollup9_AMyEcBjhDn2sGzBQk-EZqZqtOlI4il_xz6lpiw4LAVGea46Q/s1600/glass.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-3YtR4Luy2-N_D7IPSWkaTg45NvDTShYUro9MR6tH5PneK6n_4oGo71CuNmeZKD_YwWMsdjrdf0-fM8J1sja0Ollup9_AMyEcBjhDn2sGzBQk-EZqZqtOlI4il_xz6lpiw4LAVGea46Q/s1600/glass.PNG" /></a></div>
4): <b>secrets</b><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNBcEBWmwe26gGMRUei_-pEDJaRdWNZzdKRmUEBwx2qIZTqLvhISkr4BXaYLTuNHLWNUF-Vg1o7A7jduSE2pXMpUx2mex7_uAnLVFVqshoX4XaYBl_C0PV6GfNS4-PdCIdecCiQalKTrY/s1600/secrets.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNBcEBWmwe26gGMRUei_-pEDJaRdWNZzdKRmUEBwx2qIZTqLvhISkr4BXaYLTuNHLWNUF-Vg1o7A7jduSE2pXMpUx2mex7_uAnLVFVqshoX4XaYBl_C0PV6GfNS4-PdCIdecCiQalKTrY/s1600/secrets.PNG" /></a></div>
5): <b>starter</b><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQeGwgkEmnS87W9-KAFRONV5q4ygdWmxCJ0XPQj-92QXnJ6so1EeBEkQyhXQ9gwtUG1cbn8B_CHCRwXQtlVW3gvO_n5srVchxT4tAN245QdWTGp-GIHwTWWCk7aM6U_mnfu6DDn7EoIIc/s1600/starter.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQeGwgkEmnS87W9-KAFRONV5q4ygdWmxCJ0XPQj-92QXnJ6so1EeBEkQyhXQ9gwtUG1cbn8B_CHCRwXQtlVW3gvO_n5srVchxT4tAN245QdWTGp-GIHwTWWCk7aM6U_mnfu6DDn7EoIIc/s1600/starter.PNG" /></a></div>
<br /></div>
</div>
<div style="text-align: right;">
تبقى كيفية الأستخدام أثناء كتابة موضوع معين ما عليك سوى الضغط على زر html و جعل المحتوى الذي تريد إخفائه بين الأكواد التالية:</div>
<blockquote class="tr_bq">
<div style="text-align: center;">
<article id="default-usage"><br />
<div class="to-lock" style="display:none;"><br />
<br />
<span style="color: red;"><b> <span style="font-size: small;"><span style="font-family: inherit;">إجعل المحتوى المراد إخفائه هنا </span></span></b></span><br />
<br />
</div><br />
</article></div>
</blockquote>
<div style="text-align: right;">
<br />
هذا كل ما في تدوينة اليوم أتمنى أتعجبكم لا تنسى أي إستفسار أنا في الخدمة ، بالتوفيق للجميع في أمان الله</div>
</div>
Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-8722635733075134433.post-52828111235847450732014-12-03T08:38:00.001-08:002014-12-03T08:46:52.835-08:00إضافة زر رائع لمتابعة المدونة بحساب جوجل بلس<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcHik-kXl58E4fOq2CbTJjBxJmlgi56BZ47HxlYGCDOA2E9fHzVALo4NLUBWALSo39suBf-749XXtClcwUaUXI1b94eUUJs0RX0VYUGhx17M-tI9VlN74NLSE1wlPLpeJZygBzSyBk5fs/s1600/join+this+site.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcHik-kXl58E4fOq2CbTJjBxJmlgi56BZ47HxlYGCDOA2E9fHzVALo4NLUBWALSo39suBf-749XXtClcwUaUXI1b94eUUJs0RX0VYUGhx17M-tI9VlN74NLSE1wlPLpeJZygBzSyBk5fs/s1600/join+this+site.png" /></a></div>
<br />
السلام عليكم و رحمة الله وبركاته.<br />
كل مدراء المدونات يرغبون في كسب متابعين كثر لمواقعهم و غير بعيد عن أزرار المتابعة في المواقع الإجتماعية اليوم جئتكم بزر بسيط ومنسق ولا يشغل مساحة كبيرة بالقالب، يغنيك عن أداة متابعي المدونة التي تجدها في صفحة التخطيط .<br />
أنظر المعاينة الحية.<br />
<div style="text-align: center;">
<a href="http://www.blogger.com/follow-blog.g?blogID=8722635733075134433" rel="nofollow" target="_blank"><img alt="Join This Site" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR6j2Tu-4HabB869vO151P-M88RyQlW5fESZwnefZ25o2NAV6LKuf5ZRLCnYMdBEYgW9TGk7YinqV_6Cvecs2RHXfPfpNFbjY6wORXEMiEa1OIhcMF4mgxgVweVLhxbYLXFNz1k0hDUoU/s1600/Follow+my+blog.gif" title="Follow my Blog!" /></a></div>
<div style="text-align: center;">
أما تركيب الأداة فهو سهل </div>
<div style="text-align: center;">
1- تذهب إلى لوحة التحكم بلوجر ثم التخطيط </div>
<div style="text-align: center;">
2- تنقر إضافة أداة ثم تختار أداة html javascript</div>
<div style="text-align: center;">
3- تضع الكود التالي مع تغير الكود بالأحمر إلى ID مدونتك ثم تحفظ الأداة.</div>
<blockquote class="tr_bq">
<div style="text-align: center;">
<div style="background: #EBEBEB; padding: 7px; text-align: center;"><br />
<a href="http://www.blogger.com/follow-blog.g?blogID=<span style="color: red;">8722635733075134433</span>" rel="nofollow" target="_blank"><img alt="Join This Site" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR6j2Tu-4HabB869vO151P-M88RyQlW5fESZwnefZ25o2NAV6LKuf5ZRLCnYMdBEYgW9TGk7YinqV_6Cvecs2RHXfPfpNFbjY6wORXEMiEa1OIhcMF4mgxgVweVLhxbYLXFNz1k0hDUoU/s1600/Follow+my+blog.gif" title="Follow my Blog!" /></a></div></div>
</blockquote>
<div style="text-align: center;">
أتمنى أن تنال الإضافة إعجابكم دمتم بود في أمان الله</div>
</div>
Unknownnoreply@blogger.com0