Ezz Tech: إضافات

نموذج اتصال بلوجر المطور صفحة اتصل بنا جاهزة قالب اتصل بنا html Blogger

<h1 style="text-align: center;"><span style="color: red; font-size: medium;">شرح طريقة إضافة نموزج اتصل بنا بدون اخطاء وسهل التركيب لمدونات بلوجر</span></h1><p style="text-align: center;"><span style="font-size: medium;">نشرح لك اليوم طريقة إضافة نموذج اتصال في صفحة مستقلة بشكل مميز وبطريقة سهلة وبسيطة، يمكن الزوار من التواصل معك بسهولة وبشكل مرتب وبسيط جدا، مما يساعد في تطوير المدونة وحل المشاكل من خلال رسائل الزائر الذي يساعدك في معرفة أي خطا أو مشكلة تواجهه في مدونتك.</span></p><div class="post-body entry-content" id="post-body-1094986406276973831" itemprop="description articleBody" style="border: 0px none; margin: 0px; padding: 0px; text-align: center; vertical-align: top;"><div style="border: 0px none; margin: 0px; padding: 0px; vertical-align: top;" trbidi="on"><p><span style="font-size: medium;"></span></p><div class="separator" style="clear: both; text-align: center;"><span style="font-size: medium;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyfssgITSYG-2AyhWWWVARITcNuwQFZA5NUWLBsd_3yZc6EUVf6XYeV-mTwZ_4YWdm712dGqDkS8Du6XfjJX4R056ykapY0AGGo7ustzu5HWBruTXPAitxWohhbNHIiY39xPEAJGL9lfhF/s640/contact-us-form-for-blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="نموذج اتصال بلوجر المطور صفحة اتصل بنا جاهزة قالب اتصل بنا html Blogger" border="0" data-original-height="459" data-original-width="640" height="230" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyfssgITSYG-2AyhWWWVARITcNuwQFZA5NUWLBsd_3yZc6EUVf6XYeV-mTwZ_4YWdm712dGqDkS8Du6XfjJX4R056ykapY0AGGo7ustzu5HWBruTXPAitxWohhbNHIiY39xPEAJGL9lfhF/w320-h230-rw/contact-us-form-for-blogger.png" title="نموذج اتصال بلوجر المطور صفحة اتصل بنا جاهزة قالب اتصل بنا html Blogger" width="320" /></a></span></div><p><span style="font-family: Droid Arabic Kufi; font-size: medium;"><span style="background-color: white;">الصورة بالأعلى توضح شكل النموذج المطلوب وهو نموذج اتصل بناء على مدونة بلوجر، والذي يحتوي على مكان إضافة الإسم والإيميل والرسالة الخاصة بالزائر بشكل واضح وسهل وبسيط وغير متكلف ولا يسبب تجربة سيئة للزائر.</span></span></p><h2 style="border: 0px none; margin: 0px; padding: 0px; vertical-align: top;"><span style="color: red; font-size: medium;">شرح طريقة تركيب نموذج اتصال بلوجر</span></h2><div style="border: 0px none; margin: 0px; padding: 0px; vertical-align: top;" trbidi="on"><span style="font-size: medium;"> نبدأ الأن في شرح طريقة التركيب، الأمر بسيط وسهل جداً لا يحتاج منك سوى إتباع خطوات تركيب النموذج، وتغيير ما يلزم كما سنشرح لك، ليكون النموزج خاص بمدونتك وبالألوات التي تريدها.</span></div><div style="background-color: white; border: 0px none; font-family: "Droid Arabic Kufi"; margin: 0px; padding: 0px; vertical-align: top;"><br /><span style="font-size: medium;">1- في البداية إذهب الى قسم التنسيق وقم بإضافة نموذج اتصل بنا ضمن اضافات بلوجر الاساسية، طبعاً اضفها في اي مكان في التنسيق لا مشكلة لانها لا تظهر في المدونة لزوائرك، بعد ذلك توجة الى المظهر ثم تحرير HTML ثم ابحث عن الكود التالي:</span></div><div style="border: 0px none; font-family: "Droid Arabic Kufi"; margin: 0px; padding: 0px; vertical-align: top;"><span style="background-color: #ffa400; font-size: medium;"> ]]></b:skin></span></div><div style="background-color: white; border: 0px none; font-family: "Droid Arabic Kufi"; margin: 0px; padding: 0px; vertical-align: top;"><span style="font-size: medium;">ثم قم بإضافة الكود التالي أعلاه.</span></div><div style="border: 0px none; font-family: "Droid Arabic Kufi"; margin: 0px; padding: 0px; vertical-align: top;"><div style="border: 0px none; margin: 0px; padding: 0px; vertical-align: top;"><span style="background-color: #ffa400; font-size: medium;">.ContactForm{display: none!impo</span></div></div><div style="background-color: white; border: 0px none; font-family: "Droid Arabic Kufi"; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="background-color: white; border: 0px none; font-family: "Droid Arabic Kufi"; margin: 0px; padding: 0px; vertical-align: top;"><span style="font-size: medium;">2-  استخراج كود ID الخاص بالمدونة حتى يتم تخصيص نموذج الإتصال لمدونتك وتستطيع تلقي رسائل الزوار، لاستخراج الكود نتوجه إلى شريط المتصفح الخاص برابط المدونة في الأعلى، وقم بنسخ الرقم الموجود بعد علامة = في الرابط الموجود في شريط المتصفح واحتفظ به لأن سنستخدمه في الخطوة التالية.</span></div><div class="separator" style="background-color: white; border: 0px none; clear: both; font-family: "Droid Arabic Kufi"; font-size: inherit; margin: 0px; padding: 0px; text-align: center; vertical-align: top;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb6-v4m_ffFP0Vc9u6RGaQUbzBtKYDblrRTlq0lLG-1GvfZY_3Sb5nkfybAgyosbdEz76uiQBE_XJHspVGQaeS7CYqASG_Np1SvT0-8PRIMRZmA3dhF9Yx9at8peSKWortcqy9hhwS8Sc/s1600/1.PNG" imageanchor="1" style="border: 0px none; font-size: inherit; margin: 0px 1em; padding: 0px; vertical-align: top;"><img alt="Add-Contact-us-blogger" border="0" data-original-height="338" data-original-width="714" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb6-v4m_ffFP0Vc9u6RGaQUbzBtKYDblrRTlq0lLG-1GvfZY_3Sb5nkfybAgyosbdEz76uiQBE_XJHspVGQaeS7CYqASG_Np1SvT0-8PRIMRZmA3dhF9Yx9at8peSKWortcqy9hhwS8Sc/s1600-rw/1.PNG" style="border: 0px none; font-size: inherit; margin: 0px 0px 12px; max-width: 90%; padding: 0px; vertical-align: top;" title="اضافة نموذج اتصل بنا احترافي في صفحة مستقلة لمدونات بلوجر بدون اخطاء" /></a></div><h3 style="background: rgb(205, 2, 2) !important; border-radius: 4px !important; border: 0px none; color: rgb(255, 255, 255) !important; display: -webkit-inline-box; font-family: "Droid Arabic Kufi"; font-size: 16px !important; line-height: 2 !important; margin: 18px 0px 2px; padding: 2px 8px !important; vertical-align: top;">تركيب نموذج اتصل بناء في صفحة مستقلة في بلوجر </h3><div style="border: 0px none; font-family: "Droid Arabic Kufi"; margin: 0px; padding: 0px; vertical-align: top;"><div style="background-color: white; border: 0px none; margin: 0px; padding: 0px; vertical-align: top;"><span style="font-size: medium;">الان بعد أن قمت باستخراج <b style="border: 0px none; margin: 0px; padding: 0px; vertical-align: top;">ID </b>المدونة نبدأ في تركيب نموذج اتصل بنا، ويمكنك تركيب النموذج في أي جزء من المدونة سواء في جانب المدونة أو في الأسفل، لكن الأن نحن سنشرح طريقة تركيبه في صفحة مستقلة.</span></div><div style="background-color: white; border: 0px none; margin: 0px; padding: 0px; vertical-align: top;"><span style="font-size: medium;"><br /></span></div><div style="background-color: white; border: 0px none; margin: 0px; padding: 0px; vertical-align: top;"><span style="font-size: medium;">في البداية يجب عليك إنشاء صفحة، طريقة إنشاء الصفحة سهله جدا تضغط على الصفحات الموجودة في العمود الأيمن سيتم توجيهك إلى لوحة تحكم الصفحات إضغط على "صفحة جديدة".</span></div><div style="background-color: white; border: 0px none; margin: 0px; padding: 0px; vertical-align: top;"><span style="font-size: medium;"><br /></span></div><div style="background-color: white; border: 0px none; margin: 0px; padding: 0px; vertical-align: top;"><span style="font-size: medium;">كل ما عليك لإضافة نموذج اتصل بنا هو التوجه إلى الصفحة التي تم إنشائها ثم قم بتغيير طريقة العرض من "<b style="border: 0px none; margin: 0px; padding: 0px; vertical-align: top;">تأليف</b>" إلى "<b style="border: 0px none; margin: 0px; padding: 0px; vertical-align: top;">HTML</b>" ثم قم بمسح ما بدخله وضع فيها الكود التالي، لا تنسى تغيير الرقم <b style="border: 0px none; margin: 0px; padding: 0px; text-align: left; vertical-align: top;">4371357773824486577 بالرقم الخاص بمدونتك </b>وقم بحفظ الصفحة.</span></div><div style="background-color: white; border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div class="cod-rd" style="background: rgb(205, 2, 2); border-bottom-color: rgb(66, 66, 66); border-image: initial; border-left-color: initial; border-right-color: initial; border-style: solid none; border-top-color: rgb(66, 66, 66); border-width: 11px 0px; color: white; font-family: monospace; font-size: 18px; font-weight: bold; height: 300px; line-height: 2; margin: 0px; overflow: auto; padding: 14px 11px; text-align: right; vertical-align: top;"><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><link href='//fonts.googleapis.com/earlyaccess/droidarabickufi.css' rel='stylesheet'/><br /><script></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">var blogId = '<b style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">4371357773824486577</b>';</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">//The below message 5 Strings can also be edited</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">var contactFormMessageSendingMsg ='جاري الارسال...';</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">var contactFormMessageSentMsg = 'تم ارسال رسالتك بنجاح.';</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">var contactFormMessageNotSentMsg = 'تعذر إرسال الرسالة. الرجاء معاودة المحاولة في وقت لاحق.';</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">var contactFormEmptyMessageMsg ='صندوق الرسالة لا يمكن أن يكون فارغا.';</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">var contactFormInvalidEmailMsg = 'ادخل بريد إلكتروني صحيح.'</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">var widgetLoaded=false;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">function sendEmailMsg() {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">if(widgetLoaded== false) {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'sidebar', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': contactFormMessageSendingMsg , 'contactFormMessageSentMsg': contactFormMessageSentMsg , 'contactFormMessageNotSentMsg': contactFormMessageNotSentMsg , 'contactFormInvalidEmailMsg': contactFormInvalidEmailMsg , 'contactFormEmptyMessageMsg': contactFormEmptyMessageMsg , 'title': 'Contact Form', 'blogId': blogId, 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">widgetLoaded=true;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">document.getElementById('ContactForm1_contact-form-submit').click();</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">return true;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"></script></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><style type="text/css"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.login-body{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    direction: rtl;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    background: <b style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><span style="border: 0px none; color: yellow; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">#f93c64</span></b>;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    display: -webkit-box;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    margin: 10px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    border-radius: 5px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">font-family: Droid Arabic Kufi;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.login-01{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  width:85%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  margin:5% auto 3%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">form {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   padding: 0% 1%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">form li.first,li.second{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  border:none;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  list-style:none;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  margin-bottom:10px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  width:100%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.icon,.icon2  {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  height:55px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  width:55px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">vertical-align: top;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  display: -webkit-inline-box;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  border-top-right-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -o-border-top-right-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -moz-border-top-right-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -webkit-border-top-right-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  border-border-bottom-right-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -o-border-bottom-right-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -moz-border-bottom-right-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -webkit-border-bottom-right-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.user1 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    background: url(https://p.w3layouts.com/demos/pink_contact_form/web/images/icons.png) no-repeat 14px 15px #f79d29;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.email{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  background:url(https://p.w3layouts.com/demos/pink_contact_form/web/images/icons.png) no-repeat 15px -39px #f79d29;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.msg{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  background: url(https://p.w3layouts.com/demos/pink_contact_form/web/images/msg.png) no-repeat 16px 16px #f79d29;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">li.first:hover .user1{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">     background: url(https://p.w3layouts.com/demos/pink_contact_form/web/images/icons.png) no-repeat 14px 15px #DB2048;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">li.first:hover .email{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  background:url(https://p.w3layouts.com/demos/pink_contact_form/web/images/icons.png) no-repeat 15px -39px #DB2048;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">li.second:hover .msg {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  background: url(https://p.w3layouts.com/demos/pink_contact_form/web/images/msg.png) no-repeat 16px 16px #DB2048;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">/*-----*/</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">input[type="text"],form textarea {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    width: 77%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    padding: 1.13em 1em 1.13em 1em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    color: #858282;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    font-size: 17px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    outline: none;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    height: 16.2px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    background: #fff;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    font-weight: 500;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    border: none;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    font-family: inherit;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    border-top-left-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    -o-border-top-left-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    -moz-border-top-left-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    -webkit-border-top-left-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    border-border-bottom-left-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    -o-border-bottom-left-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    -moz-border-bottom-left-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    -webkit-border-bottom-left-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  .button{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">form textarea {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  resize: none;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  height: 140px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.login-01 input[type="button"]{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  font-size: 17px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  font-weight: 300;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  color: #fff;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    font-family: inherit;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  cursor: pointer;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  outline: none;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  padding: 5px 10px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  width: 25%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  border: 2px solid #F79D29;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  float: left;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  background: #F79D29;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  border-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -o-border-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -webkit-border-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -moz-border-radius: 0.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  margin-right:2.85em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">input[type="button"]:hover{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">-webkit-transform: rotate(4deg);</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  transform: rotate(4deg);</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -o-transform: rotate(4deg);</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  -moz-transform: rotate(4deg);</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">li.lost {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  margin-bottom: 21px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">/*---------------*/</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.copy-right {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  text-align: center;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  margin: 2em 0;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.copy-right p {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> color: #fff;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> font-size: 1em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> font-weight:400;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.copy-right p a {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> color:#fff;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.copy-right p a:hover {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> text-decoration: underline;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.login-body .contact-form-email-message{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    height: 106px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.login-body .contact-form-error-message-with-border{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    background: #c73352;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.login-body .contact-form-success-message{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    background: #c73352;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.login-body .contact-form-error-message-with-border,.all-emil contact-form-success-message{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    color: #fff;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    padding: 3px 0px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    border-radius: 4px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    margin: 10px 0 0 0;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    clear: both;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.login-body .contact-form-error-message-with-border img,.all-emil contact-form-success-message img{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">cursor: pointer;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    float: right;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    padding: 0px 3px 0px 0;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">/*-----start-responsive-design------*/</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">@media (max-width:1440px){</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  .login-01 input[type="button"]{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  margin-right:1.85em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">@media (max-width:1366px){</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  .login-01 input[type="button"]{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  margin-right: 1.6em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   </div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">@media (max-width:1280px){</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   .login-01 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    width: 40%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    margin:5% auto 5%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  body h1 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  font-size: 2.7em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">@media (max-width:1024px){</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  .login-01 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  width: 45%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> body h1 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  font-size: 2.5em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">@media (max-width:768px){</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  .login-01 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  width: 63%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> body h1 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  font-size: 2.3em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">@media (max-width:640px){</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  .login-01 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  width: 73%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  body h1 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  font-size: 2.1em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">@media (max-width:480px){</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   .login-01 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    width: 85%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  .copy-right p {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    font-size: 0.9em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">input[type="text"], form textarea{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> height: 14.2px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">form textarea {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    height: 140px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   input[type="text"], form textarea {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  width: 77%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  padding: 1em 1em 1em 1em;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  .icon, .icon2 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  height: 48px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  width: 48px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  .user1 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    background: url(https://p.w3layouts.com/demos/pink_contact_form/web/images/icons.png) no-repeat 11px 12px #f79d29;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">      background-size: 45%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.email{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  background:url(https://p.w3layouts.com/demos/pink_contact_form/web/images/icons.png) no-repeat 12px -36px #f79d29;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    background-size: 45%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.msg{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  background: url(https://p.w3layouts.com/demos/pink_contact_form/web/images/msg.png) no-repeat 14px 11px #f79d29;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    background-size: 45%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">li.first:hover .user1{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">     background: url(https://p.w3layouts.com/demos/pink_contact_form/web/images/icons.png) no-repeat 11px 9px #DB2048;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">      background-size: 45%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">li.first:hover .email{</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  background:url(https://p.w3layouts.com/demos/pink_contact_form/web/images/icons.png) no-repeat 12px -36px #DB2048;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   background-size: 45%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">li.second:hover .msg {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  background: url(https://p.w3layouts.com/demos/pink_contact_form/web/images/msg.png) no-repeat 14px 11px #DB2048;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   background-size: 45%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">form li.first, li.second {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  margin-bottom: 5px;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">@media (max-width:600px){</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">.login-01 {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    width: 100%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">input[type="text"], form textarea {</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    width: 65%;</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">}</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  }</div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"></style></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> <div class="login-body"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"> <div class="login-01"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   <form name="contact-form"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    <ul></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    <li class="first"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">     <a class=" icon user1"></a><input id="ContactForm1_contact-form-name" type="text"  name="name" class="text" value="" placeholder="الأسم"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">     <div class="clear"></div></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    </li></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    <li class="first"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">     <a  class=" icon email"></a><input id="ContactForm1_contact-form-email" type="text" name="email" class="text"  value="" placeholder="البريد الالكتروني"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">     <div class="clear"></div></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    </li></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    <li class="second"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    <a class=" icon msg"></a><textarea id="ContactForm1_contact-form-email-message" value="Message" placeholder="محتوى الرسالة" name="email-message" ></textarea></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    <div class="clear"></div></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">    </li></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   </ul></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   <input id="ContactForm1_contact-form-submit" type="button" onclick="sendEmailMsg()" value="إرسال"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">   <div class="clear"></div></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><div style="max-width: 450px; text-align: center; width: 100%;margin: 3px auto;"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"></div></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"></div></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"></div></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  </form></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;">  </div></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><div style="visibility: collapse; opacity: 0;" ><a href='https://ezzeldin-ahmed.blogspot.com/'>Ezzeldin Ahmed</a></div></div><div style="border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"></div></div></div><div style="background-color: white; border: 0px none; font-size: inherit; margin: 0px; padding: 0px; vertical-align: top;"><br /></div><div style="border: 0px none; margin: 0px; padding: 0px; vertical-align: top;"><span style="background-color: red; color: white; font-size: medium;">ومبروك عليك نموذج اتصال بلوجر المطور.</span></div></div></div></div>

نموذج اتصال بلوجر المطور صفحة اتصل بنا جاهزة قالب اتصل بنا html Blogger

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

مزيد من المعلومات »

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

<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/AVvXsEgVvSHfG1V0vzKHy5rO6f3sfGwdaRwn_YpTn0zDEmHcsQK5NbRWK-6B932zHtSbl34RvJqaydgry024zwwADG7TWmkkYyTwZ0hOCMUvoVautuPd3CixDiSfsCkpS43Ke9DjRFdl41dNpOD4/s1600/News+ticker+script.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="720" data-original-width="1280" height="180" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVvSHfG1V0vzKHy5rO6f3sfGwdaRwn_YpTn0zDEmHcsQK5NbRWK-6B932zHtSbl34RvJqaydgry024zwwADG7TWmkkYyTwZ0hOCMUvoVautuPd3CixDiSfsCkpS43Ke9DjRFdl41dNpOD4/s320-rw/News+ticker+script.jpg" width="320" /></a></div>
___

عزالدين احمد :<br />
<h2 style="text-align: center;">
<span style="color: red; font-size: large;">اضافة شريط متحرك اخر اخبار المدونة بثلاثة الوان احترافيه</span></h2>
<div style="text-align: center;">
<br /></div>
<span style="font-size: large;">اليوم نشرح <b>طريقة تركيب كود شريط اخباري متحرك html</b> وهو عبارة عن شريط اخباري جاهز للتركيب ولا يتطلب تغيير في قالب المدونة ، مجرد اضافة </span><br />
<table style="border-collapse: collapse; border-spacing: 0px; border: none; color: #202020; font-family: arial, sans-serif; margin: 0px; padding: 0px;"><tbody>
<tr class="gadgetsBlock" style="border-bottom: 1px solid rgb(237, 237, 237); border-top: 1px solid rgb(237, 237, 237);"><td style="margin: 0px; padding: 4px;"><span style="font-size: large;">HTML/JavaScript</span></td></tr>
</tbody></table>
<h3 style="text-align: right;">
<span style="color: red; font-size: large;">والان نبدأ في شرح تركيب كود شريط الأخبار العاجلة</span></h3>
<span style="font-size: large;">في البداية قم بفتح تبويب <b><span style="color: red;">التخطيط </span></b></span><br />
<span style="font-size: large;"><br /></span>
<span style="font-size: large;"><span style="color: red; font-weight: bold;">ثم اختار اضافة اداة </span>لكي تتمكن من<span style="color: red; font-weight: bold;"> </span>اضافة شريط اخبار لمدونة بلوجر </span><br />
<span style="font-size: large;"><br /></span>
<br />
<h3 style="text-align: right;">
<span style="color: red;"><span style="font-size: large;">ثم </span><span style="background-color: white; font-family: "droid arabic naskh" , serif; font-size: medium;">قم بنسخ الكود التالي :</span></span></h3>
<div style="background-color: white; margin: 5px 20px 20px;">
<pre class="alt2" dir="ltr" style="background-color: #f2e8dc; border: 1px inset; height: 258px; overflow: auto; padding: 6px; text-align: left; width: 100%;"><div style="text-align: right;">
<div style="font-family: "droid arabic naskh", serif; text-align: left;">
<span style="font-family: "droid arabic naskh" , serif; font-size: large;"><div style="position: </span></div>
<div style="font-family: "droid arabic naskh", serif; text-align: left;">
<span style="font-family: "droid arabic naskh" , serif; font-size: large;">fixed; bottom: 10px; border: 1px solid rgb(153, 153, 153); right: 2px; </span></div>
<div style="font-family: "droid arabic naskh", serif; text-align: left;">
<span style="font-family: "droid arabic naskh" , serif; font-size: large;">background: none repeat scroll 0pt 0pt rgb(255, 255, 255); padding: 0px;</span></div>
<div style="font-family: "droid arabic naskh", serif; text-align: left;">
<span style="font-family: "droid arabic naskh" , serif; font-size: large;"> width: 1570px; text-align: right;"></span></div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
<style></div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
#cnmunewasbar {</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
  background: #cecece;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    box-shadow: 0 0 1px #777;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    height: 40px;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    width: 100%;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
}</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
.cnmunbtile {</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
  background: #222;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    color: #fff;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    display: inline-block;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    float: right;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    padding: 7px 0;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    font: bold 14px/30px tahoma;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    height: 100%;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    margin-left: -112px;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    text-align: center;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    width: 110px;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    border-left: 4px solid #bc2f9d;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
}</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
.fa-newspaper-o:before {</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    content: "\f1ea";</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    margin: 5px;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
}</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
.cnmu-newsb-srp {</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    float: right;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    font: 14px/28px tahoma !important;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    margin-right: 112px;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    padding: 7px;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
}</div>
<div style="text-align: left;">
<div style="color: black; font-family: "Times New Roman"; font-size: medium; white-space: normal;">
</style></div>
<span style="font-family: "times new roman";"><a href='</span>https://ezzeldin-ahmed.blogspot.com/2020/07/News-ticker-script.html<span style="font-family: "times new roman";">' id='Ezzeldin' title='.'></span></div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
<script type="text/javascript"></div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmuWidth= 100;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmuScrollAmount=0;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmuScrollDelay=80;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmuDirection="right";</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmutargetlink="yes";</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmunumPosts=10;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmuBulletchar =">>>";</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmuimagebullet="yes";</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmuimgurl="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTIaMcp2GwLcu9YR6AiYocwPGlvLpvvMFTL7t5N5OK5WxXtDGvepMubRO1O74huw_psQhVYFR-qqalw2SNaJ_ro5FHrXJS1-yBl2WnXQJkCSsCAi1yDCiNdL-NvOylTZ42DVxZjBeUYi7F/s1600/%25D9%25A2%25D9%25A0%25D9%25A1%25D9%25A9%25D9%25A1%25D9%25A2%25D9%25A0%25D9%25A3_%25D9%25A1%25D9%25A9%25D9%25A1%25D9%25A5%25D9%25A5%25D9%25A6+%25281%2529+%25281%2529.png";</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmufontsize=16;</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmubgcolor="transparent";</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmulinkcolor="008EFA";</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
    var cnmulinkhovercolor="CD0317";</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
//contnue</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
var _0x96be=["\x3C\x6D\x61\x72\x71\x75\x65\x65\x20\x62\x65\x68\x61\x76\x69\x6F\x72\x3D\x22\x73\x63\x72\x6F\x6C\x6C\x22\x20\x6F\x6E\x6D\x6F\x75\x73\x65\x6F\x76\x65\x72\x3D\x22\x74\x68\x69\x73\x2E\x73\x65\x74\x41\x74\x74\x72\x69\x62\x75\x74\x65\x28\x27\x73\x63\x72\x6F\x6C\x6C\x61\x6D\x6F\x75\x6E\x74\x27\x2C\x20\x30\x2C\x20\x30\x29\x3B\x22\x20\x6F\x6E\x6D\x6F\x75\x73\x65\x6F\x75\x74\x3D\x22\x74\x68\x69\x73\x2E\x73\x65\x74\x41\x74\x74\x72\x69\x62\x75\x74\x65\x28\x27\x73\x63\x72\x6F\x6C\x6C\x61\x6D\x6F\x75\x6E\x74\x27\x2C\x20\x36\x2C\x20\x30\x29\x3B\x22\x20","\x20\x73\x63\x72\x6F\x6C\x6C\x61\x6D\x6F\x75\x6E\x74\x20\x3D\x20\x22","\x25\x22","\x20\x77\x69\x64\x74\x68\x20\x3D\x20\x22","\x20\x77\x69\x64\x74\x68\x20\x3D\x20\x22\x31\x30\x30\x25\x22","\x20\x73\x63\x72\x6F\x6C\x6C\x64\x65\x6C\x61\x79\x20\x3D\x20\x22","\x22","\x20\x64\x69\x72\x65\x63\x74\x69\x6F\x6E\x20\x3D\x20\x22","\x22\x3E","\x6C\x65\x66\x74","\x72\x69\x67\x68\x74","\x26\x6E\x62\x73\x70\x3B\x26\x6E\x62\x73\x70\x3B\x26\x6E\x62\x73\x70\x3B","\x3C\x62\x72\x2F\x3E","\x79\x65\x73","\x20\x74\x61\x72\x67\x65\x74\x3D\x20\x22\x5F\x62\x6C\x61\x6E\x6B\x22\x20","\x20","\x20\x3C\x69\x6D\x67\x20\x63\x6C\x61\x73\x73\x3D\x22\x63\x6E\x6D\x75\x62\x75\x6C\x6C\x65\x74\x62\x69\x6D\x67\x22\x20\x73\x72\x63\x3D\x22","\x22\x20\x2F\x3E","\x3C\x2F\x6D\x61\x72\x71\x75\x65\x65\x3E","","\x65\x6E\x74\x72\x79","\x66\x65\x65\x64","\x6C\x65\x6E\x67\x74\x68","\x6C\x69\x6E\x6B","\x72\x65\x6C","\x61\x6C\x74\x65\x72\x6E\x61\x74\x65","\x68\x72\x65\x66","\x20\x3C\x61\x20","\x20\x68\x72\x65\x66\x3D\x22","\x24\x74","\x74\x69\x74\x6C\x65","\x3C\x2F\x61\x3E","\x3C\x61\x20\x74\x61\x72\x65\x67\x65\x74\x20\x3D\x22\x5F\x62\x6C\x61\x6E\x6B\x22\x20\x68\x72\x65\x66\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x63\x6E\x6D\x75\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x2F\x22\x3E\x3C\x2F\x61\x3E","\x75\x70","\x3C\x73\x74\x79\x6C\x65\x20\x73\x74\x79\x6C\x65\x3D\x22\x74\x65\x78\x74\x2F\x63\x73\x73\x22\x3E\x2E\x63\x6E\x6D\x75\x2D\x6E\x65\x77\x73\x62\x2D\x73\x72\x70\x7B\x66\x6F\x6E\x74\x2D\x73\x69\x7A\x65\x3A\x31\x32\x70\x78","\x70\x78\x3B\x62\x61\x63\x6B\x67\x72\x6F\x75\x6E\x64\x3A\x23","\x3B\x66\x6F\x6E\x74\x2D\x77\x65\x69\x67\x68\x74\x3A\x6E\x6F\x72\x6D\x61\x6C\x3B\x7D\x2E\x63\x6E\x6D\x75\x2D\x6E\x65\x77\x73\x62\x2D\x73\x72\x70\x20\x61\x7B\x63\x6F\x6C\x6F\x72\x3A\x23","\x3B\x74\x65\x78\x74\x2D\x64\x65\x63\x6F\x72\x61\x74\x69\x6F\x6E\x3A\x6E\x6F\x6E\x65\x3B\x7D\x2E\x63\x6E\x6D\x75\x2D\x6E\x65\x77\x73\x62\x2D\x73\x72\x70\x20\x61\x3A\x68\x6F\x76\x65\x72\x7B\x63\x6F\x6C\x6F\x72\x3A\x23","\x3B\x7D\x69\x6D\x67\x2E\x63\x6E\x6D\x75\x62\x75\x6C\x6C\x65\x74\x62\x69\x6D\x67\x7B\x76\x65\x72\x74\x69\x63\x61\x6C\x2D\x61\x6C\x69\x67\x6E\x3A\x6D\x69\x64\x64\x6C\x65\x3B\x62\x6F\x72\x64\x65\x72\x3A\x6E\x6F\x6E\x65\x3B\x7D\x3C\x2F\x73\x74\x79\x6C\x65\x3E","\x77\x72\x69\x74\x65","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x63\x6E\x6D\x75\x2D\x6E\x65\x77\x73\x62\x2D\x73\x72\x70\x22\x3E","\x3C\x2F\x64\x69\x76\x3E"];function cnmuAdvRecentPostsScrollerv3(_0x391ax2){var _0x391ax3;var _0x391ax4;var _0x391ax5;var _0x391ax6;var _0x391ax7;var _0x391ax8;var _0x391ax9;var _0x391axa;var _0x391axb;try{_0x391ax6= _0x96be[0];if(cnmuScrollAmount){_0x391ax6= _0x391ax6+ _0x96be[1]+ cnmuScrollAmount+ _0x96be[2]};if(cnmuWidth){_0x391ax6= _0x391ax6+ _0x96be[3]+ cnmuWidth+ _0x96be[2]}else {_0x391ax6= _0x391ax6+ _0x96be[4]};if(cnmuScrollDelay){_0x391ax6= _0x391ax6+ _0x96be[5]+ cnmuScrollDelay+ _0x96be[6]};if(cnmuDirection){_0x391ax6= _0x391ax6+ _0x96be[7]+ cnmuDirection+ _0x96be[8];if(cnmuDirection== _0x96be[9]|| cnmuDirection== _0x96be[10]){_0x391ax9= _0x96be[11]}else {_0x391ax9= _0x96be[12]}};if(cnmutargetlink== _0x96be[13]){_0x391axa= _0x96be[14]}else {_0x391axa= _0x96be[15]};if(cnmuimagebullet== _0x96be[13]){_0x391axb= _0x96be[16]+ cnmuimgurl+ _0x96be[17]}else {_0x391axb= cnmuBulletchar};_0x391ax7= _0x96be[18];_0x391ax3= _0x96be[19];for(var _0x391axc=0;_0x391axc< cnmunumPosts;_0x391axc++){var _0x391ax5=_0x391ax2[_0x96be[21]][_0x96be[20]][_0x391axc];if(_0x391axc== _0x391ax2[_0x96be[21]][_0x96be[20]][_0x96be[22]]){break};for(var _0x391axd=0;_0x391axd< _0x391ax5[_0x96be[23]][_0x96be[22]];_0x391axd++){if(_0x391ax5[_0x96be[23]][_0x391axd][_0x96be[24]]== _0x96be[25]){_0x391ax4= _0x391ax5[_0x96be[23]][_0x391axd][_0x96be[26]];break}};_0x391ax3= _0x391ax3+ _0x391axb+ _0x96be[27]+ _0x391axa+ _0x96be[28]+ _0x391ax4+ _0x96be[8]+ _0x391ax5[_0x96be[30]][_0x96be[29]]+ _0x96be[31]+ _0x391ax9};_0x391ax8= _0x96be[32];if(cnmuDirection== _0x96be[9]){_0x391ax3= _0x391ax3+ _0x96be[11]+ _0x391ax8}else {if(cnmuDirection== _0x96be[10]){_0x391ax3= _0x391ax8+ _0x96be[11]+ _0x391ax3}else {if(cnmuDirection== _0x96be[33]){_0x391ax3= _0x391ax3+ _0x96be[12]+ _0x391ax8}else {_0x391ax3= _0x391ax8+ _0x96be[12]+ _0x391ax3}}};document[_0x96be[39]](_0x96be[34]+ cnmufontsize+ _0x96be[35]+ cnmubgcolor+ _0x96be[36]+ cnmulinkcolor+ _0x96be[37]+ cnmulinkhovercolor+ _0x96be[38]);document[_0x96be[39]](_0x96be[40]+ _0x391ax6+ _0x391ax3+ _0x391ax7+ _0x96be[41])}catch(exception){alert(exception)}}</div>
<div style="font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
<div style="color: black;">
</script></div>
<div id="cnmunewasbar"></div>
<div style="font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
<span class="cnmunbtile"><i class="fa fa-newspaper-o" aria-hidden="true"></i><span style="color: blue;">أخر الأخبار</span></span></div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
<script type="text/javascript" src="<span style="color: red;">https://example.com</span>/feeds/posts/default?alt=json-in-script&callback=cnmuAdvRecentPostsScrollerv3&max-results=50" ></script></div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
<div style='clear: both;'></div></div></script></div></div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: left; white-space: normal;">
</div></div>
</div>
</pre>
</div>
<h4 style="text-align: right;">
<span style="color: red; font-size: large;">ثم ضعه في أداة جافا سكربت وقم بالضغط على زرار الحفظ</span></h4>
<div style="text-align: left;">
<div style="text-align: right;">
<span style="font-size: large;">والان مبروك عليك سكربت شريط الأخبار المتحرك أو </span><span style="font-size: large;">شريط اخر المواضيع بلوجر</span></div>
<div style="text-align: right;">
<span style="font-size: large;"><br /></span></div>
<h3 style="text-align: right;">
<span style="font-size: large;"><span style="color: red;">لكن لا تنسى </span></span></h3>
<div style="text-align: right;">
<span style="font-size: large;">يجب وضع رابط موقعك في مكان الرابط </span><span style="background-color: #f2e8dc; color: red; text-align: left;"><span style="font-size: large;"><b>https://example.com</b></span></span><span style="font-size: large;"> باللون الاحمر</span></div>
<div style="text-align: right;">
<span style="font-size: large;"><br /></span></div>
<div style="text-align: right;">
<span style="font-size: large;">كما يمكنك تغيير كلمة </span><span style="font-size: large;"><span style="color: blue;"><b>أخر الأخبار</b></span> باللون الأزرق إلى أي كلمة تفضلها</span></div>
<div style="text-align: right;">
<span style="background-color: #f2e8dc; color: blue; text-align: left;"><br /></span></div>
<br style="text-align: right;" /></div>
</div>

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

___ عزالدين احمد : اضافة شريط متحرك اخر اخبار المدونة بثلاثة الوان احترافيه اليوم نشرح طريقة تركيب كود شريط اخباري متحرك html وهو ...

مزيد من المعلومات »

كود شريط الاخبار html شرح تركيب شريط متحرك للمواقع والمدونات

<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/AVvXsEjZZ3oReUIzk7Agq64w9v90OVu9CC14Mp2JiSZGddi_-kJpM5bjpAggGkT6J8eLBImlvt0Ipz5hIBpLuHPhlB4V_0KbY-3FKGUyzTjdf5DRIZIf1u2SBl7jPQ1KECkrq0ZC8_-0cI1SyZfp/s1600/breaking-news-ticker.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="333" data-original-width="700" height="152" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZZ3oReUIzk7Agq64w9v90OVu9CC14Mp2JiSZGddi_-kJpM5bjpAggGkT6J8eLBImlvt0Ipz5hIBpLuHPhlB4V_0KbY-3FKGUyzTjdf5DRIZIf1u2SBl7jPQ1KECkrq0ZC8_-0cI1SyZfp/s320-rw/breaking-news-ticker.jpeg" width="320" /></a></div>
___

عزالدين احمد :<br />
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<h2 style="font-size: 19.2px; font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; font-weight: normal; line-height: normal; margin: 0px;">
<span style="color: red; font-size: medium;">شرح تركيب كود الشريط المتحرك للمواقع والمدونات</span></h2>
</div>
<div style="background-color: white; margin: 0px; padding: 0px; text-align: center;">
<span style="background-color: transparent; text-align: right;"><span style="color: red; font-family: Droid Arabic Naskh, serif; font-size: medium;">Explanation of installing the mobile bar code for sites and blogs</span></span></div>
<div style="background-color: white; margin: 0px; padding: 0px; text-align: center;">
<span style="color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: medium;">شريط اخر الاخبار لموقعك مجانا , سكريبت اخر المواضيع فى شريط متحرك, كود أخر اخبار المدونه فى شريط متحرك , تركيب الشريط المتحرك لمدونات بلوجر</span></div>
<span style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: medium;"><br /><a href="https://1.bp.blogspot.com/-5fYX7J9u0X8/Td2q1PtqD-I/AAAAAAAAAB0/aYf8sUF5uWw/s1600/related_posts_widget.png" imageanchor="1" style="color: #772a33; margin: 0px 1em; padding: 0px; text-decoration-line: none;" target="_blank"></a></span><span style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px;"></span><span style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: medium;"><span class="Apple-style-span" style="border-collapse: separate; color: black; font-family: "times new roman"; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: normal; margin: 0px; padding: 0px;"><span class="Apple-style-span" style="font-family: "helvetica neue", arial, helvetica, sans-serif; margin: 0px; padding: 0px; text-align: left;"><br style="margin: 0px; padding: 0px;" /></span></span></span><br />
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;">بسم الله الرحمن الرحيم </span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;"><br style="margin: 0px; padding: 0px;" /></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;">اليوم سنشرح طريقه وضع كود الشريط المتحرك لاخر مواضيع الموقع او المدونات على اعلى الصفحه حيث يقوم الشريط المتحرك بعرض اخر المواضيع المضافه فى الموقع او المدونه على هيئه شريط يتحرك من اليسار الى اليمين </span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;"><br style="margin: 0px; padding: 0px;" /></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<h3 style="font-size: 16.8px; font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; font-weight: normal; line-height: normal; margin: 0px;">
<span class="Apple-style-span" style="color: red; font-size: large; margin: 0px; padding: 0px;">طريقه التركيب </span></h3>
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;">سهله جدا  بالنسبه لاصحاب المواقع لا يحتاج لشرح حيث ان طريقه التركيب على حسب البرنامج الذى يعمل به صاحب الموقع أما بالنسبه لمدونات بلوجر فتابع معنا الشرح </span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;"><br style="margin: 0px; padding: 0px;" /></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;">ندخل على لوحه التحكم  ثم تصميم ثم اضافه أداه </span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;"><br style="margin: 0px; padding: 0px;" /></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;">ونختار من الادوات التى ستظهر فى الصفحه الجديده أداه <span class="Apple-style-span" style="font-family: arial; line-height: 19px; margin: 0px; padding: 0px;">" HTML/JavaScript "  </span></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-family: arial; line-height: 19px; margin: 0px; padding: 0px;"><span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;"><br style="margin: 0px; padding: 0px;" /></span></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-family: arial; line-height: 19px; margin: 0px; padding: 0px;"><span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;">ثم فى المربع الكبير بالاسفل نضع هذا الكود التالى </span></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-family: arial; font-size: medium; line-height: 19px; margin: 0px; padding: 0px;"><br style="margin: 0px; padding: 0px;" /></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-family: arial; font-size: medium; line-height: 19px; margin: 0px; padding: 0px;"><a href="https://www.blogger.com/post-create.g?blogID=6092813740627291902" name="more" style="color: #772a33; margin: 0px; padding: 0px; text-decoration-line: none;" target="_blank"></a></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span style="font-size: medium;"><span style="font-weight: bold;"><script src="http://sites.google.com/site/taliblogsite/file/Headlines-ar-widget.txt"> </script><script style=""> var nMaxPosts = <span class="Apple-style-span" style="color: red; margin: 0px; padding: 0px;">20</span>; var sBgColor; var nWidth; var nScrollDelay = 170; var sDirection="right"; var sOpenLinkLocation="N"; var sBulletChar="»»"; </script><script style="" src="http://<span class="Apple-style-span" style="color: red; margin: 0px; padding: 0px;">ezzeldin-ahmed</span>.blogspot.com/feeds/posts/default?alt=json-in-script&amp;callback=RecentPostsScrollerv2"></script><scriqt style="color: rgb(51, 51, 255);"><span style=""></span></scriqt></span><span style="font-weight: bold;"><span style="font-style: italic;"></span></span></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span style="font-size: medium;">ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ</span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<h4 style="font-size: 15.6px; font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; font-weight: normal; line-height: normal; margin: 0px;">
<span style="color: red; font-size: medium;">ملحوظة</span></h4>
</div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;">لاحظ الكلام المحدد باللون الاحمر الرقم <span class="Apple-style-span" style="color: red; margin: 0px; padding: 0px;">20 </span>هو عدد المواضيع التى ستظهر يمكنك تغيرها لعدد أقل كما تشاء حيث أن بعد الرقم 20 ربما لا تعمل الاداه .</span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;"><br style="margin: 0px; padding: 0px;" /></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;">وبالنسبه للكلمه المحدده باللون الاحمر الثانيه فهى اسم مدونتى <span class="Apple-style-span" style="color: red; margin: 0px; padding: 0px;">ezzeldin-ahmed </span>قم بحذفها وضع اسم مدونتك بدلا منها .</span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;"><br style="margin: 0px; padding: 0px;" /></span></div>
<div style="background-color: white; color: #333333; font-family: "Droid Arabic Naskh", serif; font-size: 12px; margin: 0px; padding: 0px; text-align: center;">
<span class="Apple-style-span" style="font-size: medium; margin: 0px; padding: 0px;">بعد ذلك اضغط على كلمه حفظ اسفل الصفحه ثم قم بسحب هذه الاداه فى اعلى الصفحه حتى يتم عرض الشريط العلوى كما فى مواقع الاخبار . </span></div>
</div>

كود شريط الاخبار html شرح تركيب شريط متحرك للمواقع والمدونات

___ عزالدين احمد : شرح تركيب كود الشريط المتحرك للمواقع والمدونات Explanation of installing the mobile bar code for sites and blog...

مزيد من المعلومات »

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

<div dir="rtl" style="text-align: right;" trbidi="on">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlaqk0rH4ISpo5oAczrEPor1KxaDheY34X3PF-TdkjAD_7s7QX7rcB0Iqo6-I8GhIlKgQhkBkuxIQFH6QuwhOFa5pq5fvQVzAJ-TKOrP-aAj0dy4n_JBRYAb4KmzkIiPVRA6xKiKrb1MI/s1600/%25D8%25B7%25D8%25B1%25D9%258A%25D9%2582%25D8%25A9+%25D8%25A7%25D8%25B6%25D8%25A7%25D9%2581%25D8%25A9+%25D9%2585%25D9%2588%25D8%25B3%25D9%258A%25D9%2582%25D9%2589+%25D8%25A7%25D9%2584%25D9%2589+%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9+%25D8%25A8%25D9%2584%25D9%2588%25D8%25AC%25D8%25B1.webp" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="252" data-original-width="480" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlaqk0rH4ISpo5oAczrEPor1KxaDheY34X3PF-TdkjAD_7s7QX7rcB0Iqo6-I8GhIlKgQhkBkuxIQFH6QuwhOFa5pq5fvQVzAJ-TKOrP-aAj0dy4n_JBRYAb4KmzkIiPVRA6xKiKrb1MI/s1600-rw/%25D8%25B7%25D8%25B1%25D9%258A%25D9%2582%25D8%25A9+%25D8%25A7%25D8%25B6%25D8%25A7%25D9%2581%25D8%25A9+%25D9%2585%25D9%2588%25D8%25B3%25D9%258A%25D9%2582%25D9%2589+%25D8%25A7%25D9%2584%25D9%2589+%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9+%25D8%25A8%25D9%2584%25D9%2588%25D8%25AC%25D8%25B1.webp" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">طريقة اضافة موسيقى الى مدونة بلوجر</td></tr>
</tbody></table>
<h2 style="text-align: center;">
<span style="color: blue; font-size: x-large;"><br />شرح طريقة اضافة القران الكريم او الموسيقى واغاني الى مدونة بلوجر</span></h2>
<div style="text-align: right;">
<span style="font-size: large;">عزالدين احمد :</span></div>
<span style="font-size: large;">اقدم لكم اليوم شرح طريقة إضافة القران الكريم أو الموسيقى والاغانى على مدونتك؛ من الان يمكنك إضافة</span><span style="font-size: large;"> الموسيقى الهادئة أو الصاخبة لتعمل في خلفية مدونتك أثناء وجود زوار مدونتك.</span><br />
<br />
<span style="font-size: large;">هناك طريقتين لاضافة مشغل الموسيقى إلى مدونتك؛ وسنقوم بشرح الطريقتين ولك حرية الاختيار بينهم فيما يناسب مدونتك.</span><br />

<span style="font-size: large;"><br /></span>
<br />
<h3 style="text-align: right;">
<span style="color: blue; font-size: x-large;">الطريقة الأولى : وهيا عبارة عن موقع تقوم بالاشتراك فية وهو يقوم باضافة أداة مشغل الموسيقى على موقعك او مدونتك</span></h3>
<span style="font-size: large;"><br /></span>
<span style="font-size: large;">اسم الموقع : <a href="http://scmplayer.net/" rel="nofollow" target="_blank">http://scmplayer.net</a> </span><span style="font-size: large;">قم بالدخول الى الموقع</span><br />
<span style="font-size: large;"><br /></span>
<span style="font-size: large;">ثم قم باختيار الشكل واللون الذى تريد وضعة فى المدونة من خلال التحديد ثم اضغط <span style="color: blue;">Next</span></span><br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsbHzt9S0h8nZYbuARg4-RoGOJ-VUo32GeApKev-t55p_7GCpQXwXsFTAXuL9C5TQV0a3DQjwr62E_M7hTYl0_dPqasqIIFl2Jg-R9q5SlshJHCwptz1RgcthNIZctO1yRuas822KATNk/s1600/%25D8%25B7%25D8%25B1%25D9%258A%25D9%2582%25D8%25A9+%25D8%25A7%25D8%25B6%25D8%25A7%25D9%2581%25D8%25A9+%25D9%2585%25D9%2588%25D8%25B3%25D9%258A%25D9%2582%25D9%2589+%25D8%25A7%25D9%2584%25D9%2589+%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9+%25D8%25A8%25D9%2584%25D9%2588%25D8%25AC%25D8%25B1.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="459" data-original-width="591" height="248" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsbHzt9S0h8nZYbuARg4-RoGOJ-VUo32GeApKev-t55p_7GCpQXwXsFTAXuL9C5TQV0a3DQjwr62E_M7hTYl0_dPqasqIIFl2Jg-R9q5SlshJHCwptz1RgcthNIZctO1yRuas822KATNk/s320-rw/%25D8%25B7%25D8%25B1%25D9%258A%25D9%2582%25D8%25A9+%25D8%25A7%25D8%25B6%25D8%25A7%25D9%2581%25D8%25A9+%25D9%2585%25D9%2588%25D8%25B3%25D9%258A%25D9%2582%25D9%2589+%25D8%25A7%25D9%2584%25D9%2589+%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9+%25D8%25A8%25D9%2584%25D9%2588%25D8%25AC%25D8%25B1.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">طريقة اضافة موسيقى الى مدونة بلوجر</td></tr>
</tbody></table>
<div style="text-align: center;">
<b><span style="color: red;">============</span></b></div>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2t_gM-jJfLbr-l2cM6b3q59Fqe9uTFY4TfXgR4lIeZx1BRbNg8pCvo5Mf24vkEmB6gKGJ-n7HMpUeNIgf5APnEinFzCHCQy692n4K0Lm9ecW1xM3alYmZhm8U5wuFkFlrOtqJEziTNXQ/s1600/%25D8%25A7%25D8%25B6%25D8%25A7%25D9%2581%25D8%25A9+%25D9%2585%25D9%2588%25D8%25B3%25D9%258A%25D9%2582%25D9%2589+%25D9%2584%25D9%2584%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="487" data-original-width="589" height="264" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2t_gM-jJfLbr-l2cM6b3q59Fqe9uTFY4TfXgR4lIeZx1BRbNg8pCvo5Mf24vkEmB6gKGJ-n7HMpUeNIgf5APnEinFzCHCQy692n4K0Lm9ecW1xM3alYmZhm8U5wuFkFlrOtqJEziTNXQ/s320-rw/%25D8%25A7%25D8%25B6%25D8%25A7%25D9%2581%25D8%25A9+%25D9%2585%25D9%2588%25D8%25B3%25D9%258A%25D9%2582%25D9%2589+%25D9%2584%25D9%2584%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">طريقة اضافة موسيقى الى مدونة بلوجر</td></tr>
</tbody></table>
<div style="text-align: center;">
<span style="font-size: large;"><br /></span></div>
<span style="font-size: large;">قم بملئ البيانات المطلوبه من خلال فتح موقع <a href="http://www.youtube.com/" rel="nofollow" target="_blank">www.youtube.com</a> واختيار الايات او السور القرانية او الاغانى او الموسيقى وقم بنسخ </span><span style="font-size: large;">رابط الفيديو وضعة فى خانة <span style="color: blue;">SONG URL</span> ثم اضغط <span style="color: blue;">NEXT</span></span><br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiohFN3qbuYtAAIu4D4hiGkf8WD_5l-4bY1jgpNeC3RqOsuoNpBsnRMK_sDMe9slv-DgEJKXVNcJdTwYZ7kkw6-bY47NamKACsayrpL2Zu9r96ZOAktbwbcnqSFWY3268QmQsCOejiDiyw/s1600/%25D8%25A7%25D8%25B6%25D8%25A7%25D9%2581%25D8%25A9+%25D9%2585%25D9%2582%25D8%25B7%25D8%25B9+%25D9%2585%25D9%2588%25D8%25B3%25D9%258A%25D9%2582%25D9%2589+%25D9%2584%25D9%2584%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="275" data-original-width="592" height="148" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiohFN3qbuYtAAIu4D4hiGkf8WD_5l-4bY1jgpNeC3RqOsuoNpBsnRMK_sDMe9slv-DgEJKXVNcJdTwYZ7kkw6-bY47NamKACsayrpL2Zu9r96ZOAktbwbcnqSFWY3268QmQsCOejiDiyw/s320-rw/%25D8%25A7%25D8%25B6%25D8%25A7%25D9%2581%25D8%25A9+%25D9%2585%25D9%2582%25D8%25B7%25D8%25B9+%25D9%2585%25D9%2588%25D8%25B3%25D9%258A%25D9%2582%25D9%2589+%25D9%2584%25D9%2584%25D9%2585%25D8%25AF%25D9%2588%25D9%2586%25D8%25A9.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">طريقة اضافة موسيقى الى مدونة بلوجر</td></tr>
</tbody></table>
<h4 style="text-align: right;">
<span style="color: red; font-size: large;"><br />بعدها تظهر لك هذه الصفحة قم بالاختيار على حسب رغبتك </span></h4>
<span style="font-size: large;">اذا كنت تريد ان تعمل الموسيقى مرة واحدة او عدة مرات </span><span style="font-size: large;">او كنت تريد انها لا تعمل الا بالضغط عليها او تعمل بمجرد الدخول للمدونة والتحكم فى حجم الصوت بعد ذلك</span><br />
<span style="font-size: large;">اضغط على <span style="color: blue;">DONE</span></span><br />
<span style="font-size: large;"><br /></span>
<span style="font-size: large;">سوف يظهر لك كود فى النهاية قم بنسخ الكود واذهب الى مدونتك وا</span><span style="font-size: large;">فتح المظهر - ثم </span><span style="font-size: large;">( تحرير HTML )</span><span style="font-size: large;">؛ </span><span style="font-size: large;">ثم اضغط على CTRL +F واكتب بداخلها < body >  </span><span style="font-size: large;">ثم ضع الكود الذى حصلت علية اسفله </span><span style="font-size: large;">ثم حفظ والان قد حصلت مدونتك على مشغل الموسيقى او القران بأذن الله</span><br />

<span style="font-size: large;"><br /></span>
<br />
<h3 style="text-align: right;">
<span style="color: blue; font-size: x-large;">الطريقة الثانية : اضافة اداة مشغل الموسيقى بلغة  HTML</span></h3>
<span style="font-size: large;"><br /></span>
<span style="font-size: large;"> في البداية قم بفتح المدونة الخاصة بك ثم اذهب الى ( المظهر) ثم قم بالضغط على كلمة ( تحرير HTML )</span><span style="font-size: large;"> ثم اضغط على  Ctrl + f وابحث عن الوسم <head/> ثم ضع هذا الكود </span><span style="font-size: large;"><b>اعلاه</b> </span><br />
<span style="font-size: large;"><br /></span>
<br />
<div style="text-align: left;">
<span style="font-size: large;"><link href='http://fonts.googleapis.com/css?family=Open+Sans:400' rel='stylesheet' type='text/css'/></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><link href="https://googledrive.com/host/0B0WJjcJEFNziLXFVNjE1Mms2VkU" rel="stylesheet"></link></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.js"></script></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><script src="https://googledrive.com/host/0B0WJjcJEFNziYXRYUFZEVkRNaTA" type="text/javascript"></script></span></div>
<div>
<br /></div>
<div>
<br /></div>
<div>
<div>
<span style="font-size: large;">بعد ذلك اذهب الى التخطيط فى مدونتك ثم - اضافة اداة - ثم اختار HTML/Javascript</span></div>
<h4 style="text-align: right;">
<span style="color: red; font-size: large;">ثم قم بوضع هذا الكود فيها</span></h4>
</div>
<span style="font-size: large;"></span><br />
<div style="text-align: left;">
<span style="font-size: large;"><div class="mbl">  <div class="mbl_player" id="mnplp">  <div class="mbl_art_bg"></div>  <img class="mbl_cover" src="" alt=""/>  <span class="mnpl_title"></span>  <span class="mnpl_author"></span>    <div class="mnpl_volume_min"></div>  <div class="mnpl_volume"></div>  <div class="mbl_volume_max"></div>    <div class="mnpl_toolbar">  <div class="mnpl_tlb_prev"></div>  <div class="mnpl_tlb_stop"></div>  <div class="mnpl_tlb_next"></div>  <div class="mnpl_current"></div>  <div class="mnpl_long"></div>  <div class="mnpl_all"></div>  </div>    <div class="mbl_playlist">  </div>  </div>  </div></span></div>
<span style="font-size: large;">
<div style="text-align: left;">
<script type="text/javascript"></div>
<div style="text-align: left;">
$(function(){</div>
<div style="text-align: left;">
$('#mnplp').mnplp({</div>
<div style="text-align: left;">
'volume': 80,</div>
<div style="text-align: left;">
'playlist':[</div>
<div style="text-align: left;">
{"title":"Track-Name", "author":"Author-Name", "cover":"thumb-image.jpg", "background":"cover-image.jpg", "mfile":"music.mp3"},</div>
<div style="text-align: left;">
{"title":"Track-Name", "author":"Author-Name", "cover":"thumb-image.jpg", "background":"cover-image.jpg", "mfile":"music.mp3"},</div>
<div style="text-align: left;">
{"title":"Track-Name", "author":"Author-Name", "cover":"thumb-image.jpg", "background":"cover-image.jpg", "mfile":"music.mp3"},</div>
<div style="text-align: left;">
{"title":"Track-Name", "author":"Author-Name", "cover":"thumb-image.jpg", "background":"cover-image.jpg", "mfile":"music.mp3"},</div>
<div style="text-align: left;">
{"title":"Track-Name", "author":"Author-Name", "cover":"thumb-image.jpg", "background":"cover-image.jpg", "mfile":"music.mp3"}  ]  });  });  </script></div>
<h4 style="text-align: right;">
<span style="color: red; font-size: large;">ملحوظة 1 :</span></h4>
يوجد في هذا الكود ميزة جميلة ؛ حيث يمكنك التحكم الكامل بمشغل الموسيقى وتغير محتواه وتغيير مكان الاسماء الموجودة بالكود</span><br />
<h4 style="text-align: right;">
<span style="color: red; font-size: large;">ملحوظة 2 : </span></h4>
<div>
<span style="font-size: large;">لابد ان تكون الاغانى المحملة بصيغة mp3<br /><br />title : يمثل عنوان الموسيقى الخاصة بك أو الأغنية. <br />mfile : يمثل ملف الموسيقى في الامتداد MP3. <br />author : اسم المطرب او الملحن الذي ألف الموسيقى.<br />cover : الغلاف الذي يظهر عند تشغيل الأغنية.<br /> background : الصورة التي تظهر في خلفية مشغل الموسيقى</span></div>
</div>

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

طريقة اضافة موسيقى الى مدونة بلوجر شرح طريقة اضافة القران الكريم او الموسيقى واغاني الى مدونة بلوجر عزالدين احمد : اقدم لكم اليوم ش...

مزيد من المعلومات »

بالفيديو : اسهل طريقة ل تغيير شكل الماوس لأشكال رائعة بدون برامج

بالفيديو : اسهل طريقة ل تغيير شكل الماوس لأشكال رائعة بدون برامج

___ عزالدين احمد : الفيديو من خلاله نستطيع تغيير شكل الماوس لأشكال روعة من خلال مجموعة كبيرة من أشكال الماوس التي يقدمها الفيديو

مزيد من المعلومات »

اسهل طريقة لاضافة مشاركة مواضيع بلوجر منزلقه امام الزائر تضم كل مواقع التواصل والواتساب

<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/AVvXsEjHK1GGHHBwWrYNaj72eCDKjTfmSvHRLXt6cpHaVwvmSFfsZdh4e4ellogzN_PCZfxieYsExfb95UAip027Vnwa6gRF683GiOb00tooyHdzYaE_04yIKlPGwiketpIOUmaYL-2agi2xsWJL/s1600/%25D8%25B9%25D8%25B2%25D8%25A7%25D9%2584%25D8%25AF%25D9%258A%25D9%2586+%25D8%25A7%25D8%25AD%25D9%2585%25D8%25AF+2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="174" data-original-width="538" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHK1GGHHBwWrYNaj72eCDKjTfmSvHRLXt6cpHaVwvmSFfsZdh4e4ellogzN_PCZfxieYsExfb95UAip027Vnwa6gRF683GiOb00tooyHdzYaE_04yIKlPGwiketpIOUmaYL-2agi2xsWJL/s1600-rw/%25D8%25B9%25D8%25B2%25D8%25A7%25D9%2584%25D8%25AF%25D9%258A%25D9%2586+%25D8%25A7%25D8%25AD%25D9%2585%25D8%25AF+2.jpg" /></a></div>
<span style="font-size: large;">___

عزالدين احمد :</span><br />
<br />
<div style="text-align: center;">
<span style="font-size: large;"><span style="color: red;">السلام عليكم ورحمة الله وبركاته </span></span></div>
<span style="font-size: large;"><span style="font-size: large;"><br /></span>
اليوم اتيت لكم بإضافة رائعة ومفيدة جدا وعملية جدا خاصة على الهواتف النقاله فضلا عن الحاسوب<br />وهي اضافة مشاركة الموضوع على مواقع التواصل الاجتماعي وزياده عليه موقع او تطبيق الواتساب<br />الجميل في الاضافة هو سهولة وضعها على مدونات بلوجر وشكلها الجزاب وتعدد المواقع التي تمكن الزائر من نشر الموضوع على كل المواقع</span><br />
<br />
<br />
<b><span style="color: blue; font-size: x-large;"><br /></span></b>
<b><span style="color: blue; font-size: x-large;">طريقة التركيب</span></b><br />
<span style="font-size: large;">طريقة التركيب هي بسيطه جدا جدا - </span><br />
<span style="font-size: large;"><br /></span>
<span style="font-size: large;">اولا اذهب الى اضافة اداة من ادوات بلوجر</span><br />
<span style="font-size: large;">ثم قم بإختيار اداة كما هو مبين في هذه الصورة</span><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCK5CDON2sBpcH4RNLGlJeexmkbrjk4YJi4ImTNuRy3-GlSvO81k2dqXw1G09oUjx2-VHrWXpTjoequ9A6zpB0M8Gu6gpSL1MhY0YNdzPkOhOAabfcA8xO_urA9BuoPn86WghzQftHMuWS/s1600/u.hg%255Ddk+hpl%255D.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="181" data-original-width="286" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCK5CDON2sBpcH4RNLGlJeexmkbrjk4YJi4ImTNuRy3-GlSvO81k2dqXw1G09oUjx2-VHrWXpTjoequ9A6zpB0M8Gu6gpSL1MhY0YNdzPkOhOAabfcA8xO_urA9BuoPn86WghzQftHMuWS/s1600-rw/u.hg%255Ddk+hpl%255D.jpg" /></a></div>
<div style="text-align: right;">
<br /></div>
<div style="text-align: right;">
<br /></div>
<div style="text-align: right;">
<span style="font-size: large;"><br /></span></div>
<div style="text-align: right;">
<span style="font-size: large;">وعند الضغط عليها ستفتح لك قائمه مثل التي في الصورة التاليه</span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghTQIAP_s7paaMne9aUhkAk7WRhBcURGRdc5ZSJ0Yy1QLSI2Gq5XC6Po2L-VKYDBiMvu3kgilFm2I8xFOFo6u9iP7AnDpd2rwRSBzLL7iP948HV0-RAw9qi7RoRA6HS13X0lYx8MpZkTPl/s1600/%25D8%25B9%25D8%25B2%25D8%25A7%25D9%2584%25D8%25AF%25D9%258A%25D9%2586+%25D8%25A7%25D8%25AD%25D9%2585%25D8%25AF1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="274" data-original-width="450" loading="lazy" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghTQIAP_s7paaMne9aUhkAk7WRhBcURGRdc5ZSJ0Yy1QLSI2Gq5XC6Po2L-VKYDBiMvu3kgilFm2I8xFOFo6u9iP7AnDpd2rwRSBzLL7iP948HV0-RAw9qi7RoRA6HS13X0lYx8MpZkTPl/s1600-rw/%25D8%25B9%25D8%25B2%25D8%25A7%25D9%2584%25D8%25AF%25D9%258A%25D9%2586+%25D8%25A7%25D8%25AD%25D9%2585%25D8%25AF1.jpg" /></a></div>
<div style="text-align: center;">
<span style="font-size: large;"><br /></span></div>
<div style="text-align: right;">
<span style="font-size: large;">ثم قم بإختيار اداة </span></div>
<br />
<table style="border-collapse: collapse; border-spacing: 0px; border: none; color: #202020; font-family: arial, sans-serif; font-size: 14.4px; margin: 0px; padding: 0px;"><tbody>
<tr class="gadgetsBlock" style="border-bottom: 1px solid rgb(237, 237, 237); border-top: 1px solid rgb(237, 237, 237);"><td class="gadgetThumbnail" style="display: inline-block; margin: 0px; overflow: hidden; padding: 4px; text-align: center; width: 100px;"></td><td style="margin: 0px; padding: 4px;">HTML/JavaScript</td></tr>
</tbody></table>
<br />
<div>
<br /></div>
<div>
<span style="font-size: large;"><b>وضع فيها الكود التالي : </b></span><br />
<span style="font-size: large;"><b><br /></b></span>
<br />
<table style="border-collapse: collapse; border-spacing: 0px; border: none; color: #202020; font-family: arial, sans-serif; font-size: 14.4px; margin: 0px; padding: 0px;"><tbody>
<tr class="gadgetsBlock" style="border-bottom: 1px solid rgb(237, 237, 237); border-top: 1px solid rgb(237, 237, 237);"><td class="gadgetThumbnail" style="display: inline-block; margin: 0px; overflow: hidden; padding: 4px; text-align: center; width: 100px;"></td><td style="margin: 0px; padding: 4px;"><br />
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: right;">
<div style="text-align: left;">
<span style="font-size: large;"><b><div style="position: </b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b>fixed; bottom: 10px; border: 1px solid rgb(153, 153, 153); right: 2px; </b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b>background: none repeat scroll 0pt 0pt rgb(255, 255, 255); padding: 0px;</b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b> width: 240px; text-align: right;"></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b><div class='a2a_kit a2a_kit_size_32 a2a_default_style'></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b><a class='a2a_dd' href='https://www.addtoany.com/share'/></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b><a class='a2a_button_facebook'/></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b><a class='a2a_button_twitter'/></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b><a class='a2a_button_whatsapp'/></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b><a class='a2a_button_facebook_messenger'/></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b><a class='a2a_button_copy_link'/></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b></a></a></a></a></a></a></div></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b><script async='async' src='https://static.addtoany.com/menu/page.js'/></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b><script style="" src="http://ezzeldin-ahmed.blogspot.com"></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b></b></span></div>
<div style="text-align: left;">
<span style="font-size: large;"><b>    </div></script></div></b></span></div>
</div>
<span style="color: black; font-family: "times new roman"; font-size: large; text-align: right;"></span><br />
<div style="color: black; font-family: "Times New Roman"; font-size: medium; text-align: right;">
</div>
<div style="color: black; font-family: "Times New Roman"; font-size: medium;">
</div>
</td></tr>
</tbody></table>
<br />
<br /></div>
<div style="text-align: left;">
<span style="color: red; font-size: large;"><br /></span></div>
<div>
<span style="color: red; font-size: large;">ثم اضغط حفظ - ومبروك عليك الاده الجميله - ولا تنساني من دعمك بنشر الموضوع لتعم الفائده وشكرا لك مقدما ^_^</span></div>
<div>
<br /></div>
</div>

اسهل طريقة لاضافة مشاركة مواضيع بلوجر منزلقه امام الزائر تضم كل مواقع التواصل والواتساب

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

مزيد من المعلومات »