468x60 Ads

شرح عمل بث مباشر لمباريات في مدونتك

السلام عليكم
اليوم سوف نشرح ليكم كيف عمل بـث مباشر لـمبـارات فريقين في مدونـتك أو موقعك  ...
أول شيئ نقوم به هو تحميل شعارات الدوريات التي تريد نقلها في مدونتك أو موقعـك
 مـثال 
 

المرحلة الثانية 
الـدهاب الـى موقع http://www.hqfooty.tv/
تم تخـتار القناة التي تنقل المبـارات تم تدهب الى أسفـل الـقناة تم تـقم بنـسـخ الكود الدي يوجد تحت القناء 
المرحلة الـثالثة و الأخيرة 
الدهاب الى مدونتك تقم بـضغط على مشاركة تـقم بكتابة أسماء الفريقين تم تقم بنسـخ
شعار البطولة التي ينتمي اليهـا الفريقين تم تدهب الى html تم تقم بنـسـخ كود الذي و جدتـه تـحت القـناة و تقم باضافة المشاركة في مدونتك

الأسبوع المقبل انشاء الله سيتم الشرح بفيديوا وشكرا  

                                          بقلم:عبدالحق حفيض



 



طريقة كتابة تدوينة ونشرها في مدونتك ، دورة بلوجر

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



اضافة تابعنا عبر الشبكات الاجتماعية



 بسم الله الرحمن الرحيم اللهم صل علي نبينا محمد في الاولين وصل عليه في الاخرين وصل عليه في كل وقت وحين وصل عليه في الملا الاعلي الي يوم الدين , اليوم ساقدم لك اضافة وهي  صندوق تابعنا عبر الشبكات الاجتماعية وهذه الاداه جميله وبسيطه جداً وسهله التركيب


كيفية التركيب :




نذهب للوحة التحكم ثم اضافة اداة جديدة جافا اسكربت وتضيف الكود التالي : 

<div class="social" style="-webkit-transition: all 0.3s ease-in-out; background-color: #e9e9e9; background-position: initial initial; background-repeat: initial initial; height: 48px; margin-bottom: 5px; text-align: right; width: 300px;">
<a href="https://www.facebook.com/momayazz" style="-webkit-transition: all 0.3s ease-in-out; color: #a72c02; font-family: tahoma; font-size: 12px; line-height: 16px; text-align: start; text-decoration: initial;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpW7NlBXhZpq7R0lKiVbyp_00kjfYUjzDZcu_AI9iBmkhd3NymvvfrgdVepac2UOF1j0TaVCqxSrcpqJf_T_lYzS7_8XJXRIn2rMGZ51U5p7Hsa3lae2-B7q8K0XCkUYHXEAKefk5lqC4/s1600/face.png" style="-webkit-transition: all 0.3s ease-in-out; border: none; float: right; position: relative;" /><b style="-webkit-transition: all 0.3s ease-in-out; color: #575757; float: right; font-family: Arial, Helvetica, sans-serif; font-size: 19px; line-height: 47px; padding-left: 10px; padding-right: 16px;">250</b><span style="-webkit-transition: all 0.3s ease-in-out;  float: right;  line-height: 47px; padding-left: 10px;font-family:Tahoma, Geneva, sans-serif;color:#9f9d9d;">معجب على الفيسبوك</span></a></div>

<div class="social" style="-webkit-transition: all 0.3s ease-in-out; background-color: #e9e9e9; background-position: initial initial; background-repeat: initial initial; height: 48px; margin-bottom: 5px; text-align: right; width: 300px;">
<a href="https://twitter.com/.........." style="-webkit-transition: all 0.3s ease-in-out; color: #a72c02; font-family: tahoma; font-size: 12px; line-height: 16px; text-align: start; text-decoration: initial;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1JEYaOF_AgJpxS3Kp9n6IpOTplZlwdsPVJsoONIxtWu-q04pGYUHhPJYv827xzMm-hYEpuF2nf-o7fMQ-UXTCnzv9bsGx-niwlmseXrCv-sjbbRtJXatxqWdyfnxXq4vMG2ciii5Zp9M/s1600/twi.png" style="-webkit-transition: all 0.3s ease-in-out; border: none; float: right; position: relative;" /><b style="-webkit-transition: all 0.3s ease-in-out; color: #575757; float: right; font-family: Arial, Helvetica, sans-serif; font-size: 19px; line-height: 47px; padding-left: 10px; padding-right: 16px;">137</b><span style="-webkit-transition: all 0.3s ease-in-out;  float: right;  line-height: 47px; padding-left: 10px;font-family:Tahoma, Geneva, sans-serif;color:#9f9d9d;">متابع على تويتر</span></a></div>

<div class="social" style="-webkit-transition: all 0.3s ease-in-out; background-color: #e9e9e9; background-position: initial initial; background-repeat: initial initial; height: 48px; margin-bottom: 5px; text-align: right; width: 300px;">
<a href="http://feeds.feedburner.com/th3featured" style="-webkit-transition: all 0.3s ease-in-out; color: #a72c02; font-family: tahoma; font-size: 12px; line-height: 16px; text-align: start; text-decoration: initial;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsXBw_OQP-76jYElmN0uRHzIsXBcDz2TWaIUn-4_C0KASgWCF16_2gSGUW13ME7psAwsRuXyckvJeUwGBVKYCd3QWqReA6ML8LCmdpIL8QvfqM8LvVPPgspjnEAs1oShSeaeAdcHiga5k/s1600/RSS.png" style="-webkit-transition: all 0.3s ease-in-out; border: none; float: right; position: relative;" /><b style="-webkit-transition: all 0.3s ease-in-out; color: #575757; float: right; font-family: Arial, Helvetica, sans-serif; font-size: 19px; line-height: 47px; padding-left: 10px; padding-right: 16px;">100</b><span style="-webkit-transition: all 0.3s ease-in-out;  float: right;  line-height: 47px; padding-left: 10px;font-family:Tahoma, Geneva, sans-serif;color:#9f9d9d;">مشاركة</span></a></div>



الاعدادت : 

1- غير ما لون باللون الاحمر الى رابط صفحة مدونتك في الفيسبوك 
2- غير ما لون بالأزرق الى رابط صفحة مدونتك في تويتر 
3- غير ما لون بالاخضر الى رابط خلاصات مدونتك 

لتغيير الاعداد التي بجانب الايقونات 
ابحث عن العدد بواسطة لوحة التحكم (ctrl+f) ثم غير الى اي عدد تريده ... 
ملاحظة الاعداد ملونة باللون البرتقالي ... 

وشكرا .................





أنشر روابط تدويناتك على الفايسبوك بطريقة مميزة



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

لمعاينة مثال :

أما لندخل في الشرح البسيط :
نتجه عب هذا المسار
القالب ==> تحرير Html ==> نوسع عناصر الواجهة
أولا نبحث عن الكود التالي بالضغط Ctrl+F من قالب مدونتك :
<data:post.body/>
ونضع قبله هذا الكود:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
   <b:if cond='data:post.snippet'>
   <meta expr:content='data:post.snippet' name='description'/>
   <meta expr:content='data:post.snippet' name='og:description'/>
   </b:if>
 </b:if>


إحذف الرسالة المزعجة "عرض أحدث المشاركات ذات التصنيف..."

السلام عليكم
لعل كل أصحاب المدونات يتضايقون من جملة "عرض أحدث المشاركات ذات التصنيف xxxx"

لكن مع علاء لم تصبح هده مشكلة ،لدي الحل تابعوني ...
ندخل إل قالب المدونة ، ونبحث عن الكود التالي بإستخدام CTRL+F من الكوبيود :

<b:includable id='status-message'>

<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

ونعوضه بالكود التالي :

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

في أمان الله ..


إختصارات لوحة المفاتيح لكسب المزيد من الوقت في التدوين


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

الإختصاراتالمهمة
مدونة المميز
Ctrl + Bجعل النص سميك
Ctrl + iجعل النص مائل
Ctrl + Zللتراجع عن خطوة
Ctrl + Yإلغاء التراجع
Ctrl + Shift + Pمعاينة الرسالة قبل العرض
Ctrl + Sحفظ الرسالة كمسودة
Ctrl + Pنشر الرسالة

دمتم سالمين وفي أمان الله ..


تحياتي..



ركب سلايدشو مميز لمدونتك



السلام عليكم..
اهلا بكم محبي مدونة المميز..

اقدم لكم اليوم كيفية إضافة سلايد شو جميل وأنيق وبسيط فقط تابعوا معي كيفية التـركيب

المعاينة:

أضف الكود التالي مباشرة قبل : ]]></b:skin>
كود HTML:
#featured{
margin-bottom:10px;
} .sliderwrapper{
; border-bottom-wid
position: relativ eth: 6px; height: 124px; }
visibility: hidden; positi
.sliderwrapper .contentdiv {on: absolute; height: 100%;
m.Microsoft.alpha(opacity=100);-moz-opacity: 1;opacity: 1; padding:15px 15px 15px 0px;
filter:progid:DXImageTransfo rbackground:#f1f1f1; border-radius: 5px 5px 5px 5px; box-shadow: 0 0 3px #ABABAB; margin-top:10px; } .pagination{
4px 8px; } .pagin
text-align: right; margin-top: 50px; padding:5px; } .pagination a{ font:11px Arial; color:#a3a3a3; padding:4px 8p xation a.selected{ color:#4f4f4f; } .pagination .prev,.pagination .next { color:#EAEAEA;
px 10px 10px !important; bottom:0; float:left
font-size:0px; background:none; padding:0px; } .featuredPost{ width:410px; padding:0px 1 0!important; margin-right: 54px; } .featuredPost a{ color:#515151; font: 18px "Microsoft Sans Serif"; margin:0; padding:0; }
px; margin:4px 0 0 0; color:#797979
.featuredPost h2{margin:0 0 8px 0;} .featuredPost span{font-size:11px; margin:0; color:#797979;} .featuredPost p{font-size:1 2;} .sliderPostPhoto a img{float: right !important;}
!important;}
.sliderPostPhoto{float: right !important; width:100p x
الآن أضف الكود التالي قبل : </head>

كود HTML:
&lt;script&gt;
/* Script from:http://simplexdesign.blogspot.com/ */
imgr = new Array();
imgr[0] = &quot;http://lh3.ggpht.com/_kViOplhgIHI/TKxBIScZTiI/AAAAAAAAAWE/PM7AQ1lf6ME/noimages.jpg&quot;;
showRandomImg = true;
aBold = true;
summaryPost = 140;
numposts1 =21;
label1 = &quot;إنترنت&quot;;
function removeHtmlTag(strx,chop){var s=strx.split(&quot;&lt;&quot;);for(var i=0;i&lt;s.length;i++){if(s[i].indexOf(&quot;&gt;&quot;)!=-1){s[i]=s[i].substring(s[i].indexOf(&quot;&gt;&quot;)+1,s[i].length)}}s=s.join(&quot;&quot;);s=s.substring(0,chop-1);return s}
function showrecentposts1(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i&lt;numposts1;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k&lt;entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k&lt;entry.link.length;k++){if(entry.link[k].rel=='replies'&amp;&amp;entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(&quot;&quot;)[0];break}}
if (&quot;content&quot; in entry) {
var postcontent = entry.content.$t;}
else
if (&quot;summary&quot; in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = &quot;&quot;;
postdate = entry.published.$t;
if(j&gt;imgr.length-1) j=0;
img[i] = imgr[j];
s = postcontent    ; a = s.indexOf(&quot;&lt;img&quot;); b = s.indexOf(&quot;src=\&quot;&quot;,a); c = s.indexOf(&quot;\&quot;&quot;,b+5); d = s.substr(b+5,c-b-5);
if((a!=-1)&amp;&amp;(b!=-1)&amp;&amp;(c!=-1)&amp;&amp;(d!=&quot;&quot;)) img[i] = d;
var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=[&quot;Jan&quot;,&quot;Feb&quot;,&quot;Mar&quot;,&quot;Apr&quot;,&quot;May&quot;,&quot;Jun&quot;,&quot;Jul&quot;,&quot;Aug&quot;,&quot;Sep&quot;,&quot;Oct&quot;,&quot;Nov&quot;,&quot;Dec&quot;];var day=postdate.split(&quot;-&quot;)[2].substring(0,2);var m=postdate.split(&quot;-&quot;)[1];var y=postdate.split(&quot;-&quot;)[0];for(var u2=0;u2&lt;month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break;
}}
var daystr = day+ ' ' + m + ' ' + y ;
var trtd = '&lt;div class=&quot;contentdiv&quot;&gt;&lt;div class=&quot;sliderPostPhoto&quot;&gt;&lt;a href=&quot;'+posturl+'&quot;&gt;&lt;img width=&quot;155&quot; height=&quot;121&quot; class=&quot;alignnone&quot; src=&quot;'+img[i]+'&quot;/&gt;&lt;/a&gt;&lt;div class=&quot;sliderPostInfo&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=&quot;featuredPost&quot;&gt;&lt;h2&gt;&lt;a href=&quot;'+posturl+'&quot;&gt;'+posttitle+'&lt;/a&gt;&lt;/h2&gt;&lt;span&gt;'+daystr+'&lt;/span&gt;&lt;p&gt;'+removeHtmlTag(postcontent,summaryPost)+'...&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;';
document.write(trtd);
j++;
}}
&lt;/script&gt;
مع تغيير إنترنت باسم القسم الذي سيتم عرض مواضيعه عشوائيا
numposts1 =21 : عدد المواضيع المعروضة
وهذا الكود قبل : </body>


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

وأخيرا
ومن القالب أضف الكود التالي بعد <div id='main-wrapper'> :


كود HTML:
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div id='featured'>
<div class='sliderwrapper' id='slider1'>
<script>
document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/&quot;+label1+&quot;?max-results=&quot;+numposts1+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script>
</div>
<div class='pagination' id='paginate-slider1'>
</div>
</div>
</b:if>

المصدر:معهدالخبـراء



الدرس الثاني من دورة تعليم بلوجر : طريقة تركيب القوالب




بسم الله الرحمان الرحيم ..
بعدما تتبعنا الدرس الأول بحمد لله بخير و عرفنا كيف ننشىء مدونة جديدة 
لمن فاته الدرس من هنا 

أولا ندخل إلى موقع القوالب الأجنبية : www.btemplates.com
أو موقع القوالب العربية : http://www.pro-arabicbloggertemplates.com/
نحمله بالطريقة عادية سنضغط على download في القالب الذي تريد
الأن هو على الجهاز
سندخل إلى مدونتنا عبر 
بعد ذلك نضغط على

ثم نضغط على نسخ إحتياطي / إستعادة
نسخ إحتياطي يعني تحفض نسخة من القالب على جهازك ، عند وقوع مشكل في القالب ترفع النسخة الإحتياطية و هذه جد ضرورية
لضمـــان إستمرارية المدونة ..
ثم نختار الأن ملف القالب المحمل طبعا إمتداده .xml
{و إذا كنت تريد حفض نسخة إحتياطية إضغط على "تنزيل النموذج الكامل"}

نختار الملف ...
ثم نضغط على "Ouvrir"

الأن نضغط على تحميل لرفعه إلى المدونة

و مبروووك عليك

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





الدرس الأول من دورة تعليم بلوجر : طريقة إنشاء مدونة



بسم الله الرحمان الرحمان الرحيم ..
اهلا و سهلا بكم في أول موضوع في دورة تعليم بلوجر ..

اولا لنعرف بلوجر ..
بلوجر هو موقع تابع لجووجل {من خدماته} يتيح لك إنشاء مدونة او مدونات متعددة طبعا بالمجان ،
هذه المدونة التي أنشأتها يمكنك أن تكتب فيها ما تريد و تدعو الأخرين ليشاركوا معك تدويناتك ،
كإضافة مدونات بلوجر هي الأأكثر قبولا لدى جووجل أدسنس و هو برنامج لكسب المال من مدونتك و هو كذلك
خدمة من خدمات جووجل ..
بعد أن عرفنا ما هو بلوجر ، سنتطرق الأن إلى كيف ننشىء مدونة ؟
اول حاجة يجب ان تمتلك حساب Gmail في جووجل ..
ثم ا ندخل إلى الموقع التالي :
www.blogger.com

نتصل بإيميلنا المسجل في gmail
ثم نضغط هنا لفتح مدونة جديدة
{إضغط على الصورة لمشاهدتها بحجمها الأصلي}

ثم نختار إسم مدونتنا الجديدة ، و رابطها ، و قالبها {سنتطرق في الدرس القادم إلى كيفية تركيب قالب مميز على المدونة}


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


طريقة تغيير شكل السكرول بار




بسم الله الرحمان الرحيم

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

اليوم بإذن الله سنتعلم طريقة جد بسيطة لتغيير شكل السكرول بار ..

اولا اعطيكم مثال حي عن السكرول البار 


نتجه إلى

ثم 

ثم نضغط على Ctrl+F {للبحث} و نكتب
]]></b:skin>

ثم نكتب هذا الكود فوقه مباشرة

::-webkit-scrollbar{
 background:#e1e1e1;
 width:15px;
}
::-webkit-scrollbar-thumb{
 -webkit-shadow:inset 0 0 6px rgba(0,0,0,0.5);
 -webkit-border-radius:30px;
 background-image:-webkit-linear-gradient(top,#9bcfff 25%,#0e8aff 51%);
}
::-webkit-scrollbar-track{
 -webkit-shadow:inset 0 0 6px rgba(0,0,0,0.3);
 -webkit-border-radius:30px;
}



إحفط لاقالب و مبروووك عليك









طريقة إنشاء نموذج "إتصل بنا"


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

اولا ندخل على الموقع التالي :

ثم  نختار من هنا خصائص الفورم يعني {العنوان - الإيميل - نص الرسالة ...} و بالمقابل  تختار هل الخانة ضرورية 
ام لا

و هنا نختار تصميم الفورم {لون الخلفية - لون الخط - حجم الخط ...}

ندخل هنا الإيميل الخاص بنا

مشاهدة لحد الأن ماذا فعلت {كل شيء تمام}

نضغط اخيرا على Create Formular للحصول على كود الفورم

ننسخ الكود ثم نذهب إلى بلوجر و نقوم بعمل صفحة جديدة ثم HTML ثم نلصق الكود و مبروووك عليك


أتمنى ان ينال الموضوع إعجابكم ..
مع السلامة


إفتتاح دورة لتعليم بلوجر من الصفر ، حصريا على مدونة علاء

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

إلى هنا تنتهي تدوينتي البسيطة  ، اضرب لكم موعدا في الدرس الأول من الدورة