Browse »
الرئيسية »
Posts filed under اضافات بلوجر
السلام عليكم ورحمه الله وبركاته
المدونة تعود من جديد لتنشر المزيد من الابداع
والدروس والدورات وكما عودتكم المدونة علي نشر ما هو حصري انتظرونا الايام المقبله سوف نقوم بنشر كل ماهو جديد في عالم البلوجر من اضافات وقوالب وهكات وكل شئ يخص البلوجر ولكن نحن نحتاج لتشجعيكم كما في السابق لنعود بقوة
فريق عمل الموقع
لا يدعم موقع فيس بوك زر أضافة كصديق للمواقع والمدونات لذا قمت بتطوير زر جديد بأستخدام كود popup window لأضافتك كصديق علي الفيس بوك تماماً كزر تسجيل الدخول عن طريق الفيس بوك ..يمكنك أضافة الزر والتعرف عليه عن قرب علي مدونة يور بروفايل
تحتاج لأضافة هذا الزر لمدونتك لعدة خطوات تحتاج وضعها في مدونتك
قم بتسجل الدخول لحساب بلوجر ادخل علي منصة قالب مدونتك تحرير html ثم توسيع واجهة المستخدم وقم بالبحث عن الوسم التالي <html ثم ضع الكود التالي كما هو موضح بالصورة
xmlns:fb="http://ogp.me/ns/fb#"
قم بالبحث عن الوسم التالي <body> و ضع هذا الكود بعده مباشرة
<div id='fb-root'/>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appid=App_ID";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
أستبدل الكلمة باللون الأحمر في الكود السابق برقم ID الخاص بالتطبيق الخاص بمدونتك يمكنك أنشاء تطبيق جديد الأن
أخر خطوة ضع الكود التالي في اي مكان تريد سواء في اداة تحرير html او في القالب نفسه حيث سيظهر زر login
<fb:login-button show-faces="true" width="200" max-rows="1"></fb:login-button>
بسم الله الرحمن الرحيم وبه نستعين والصلاة والسلام علي اشرف المرسلين سيد الخلق اجمعين سيدنا محمد صلي الله عليه وسلم ثم اما بعد هذا الموضوع طلبه مني عضونا العزيز amir aliraQi وهذا الدرس علي شرفه ونتوكل علي الله في شرح الموضوع سهل وجميل جداً ولكن يحتاج الي بعض التركيز
هذا الكود ولكن نحن سنعدل فيه ليتلائم مع المدونة والاضافة
<--start add to blogger by blogger-face.com--><center><form action="http://www.blogger.com/add-widget" method="post" target="_blank"><span style="font-size: large;"><b>Widget Title: </b></span> <input name="widget.title" size="25" type="text" value="Widget Title Here" /></center><br><center><input name="go" style="font-size: 20px; width: 180px;" type="submit" value="Add to Blogger" /><textarea name="widget.content" style="display: none; height: 0px; width: 0px;">هنا ضع كود الاضافة</textarea><input name="infoUrl" type="hidden" value="ضع هنا رابط مدونتك او موقعك" /><input name="logoUrl" type="hidden" value="رابط شعار مدونتك" /></form></center><--end add to blogger by blogger-face.com-->
هذ فقط كل ما في الامر وشكر خاص لـ amir aliraQi
والسلام عليكم ورحمة الله وبركاته
ومنتظر تقيمكم للموضوع
بسم الله الرحمن الرحيم وبه نستعين والصلاة والسلام علي اشرف المرسلين وسيد الخلق سيدنا محمد صلي الله عليه وسلم ثم اما بعد اليوم مع درس جديد وهو طريقة تسريع المدونة ولكن دون اكواد جي كيوري ولا غيره بل هي عن طريق ضغط الاكواد اكواد css كما فعلت في بلوجر فيس وانا لن اطيل عليكم لنذهب للشرح
اولا اذهب الي لوحة تحكم بلوجر
>>قالب>>تحريرhtml>>متابعة>>توسيع عناصر وجهة المستخدم
واضغط علي الزر الي بالاسفل
بعد ان دخلت الموقع اقعل كما في الصورة
 |
اضغط علي الصورة لتكبيرها
نرجع الي بلوجر وننسخ الاكواد التي بين
<b:skin><![CDATA[/*
و
]]></b:skin>
ثم نضع الاكواد في المربع الكبير ونضغط علي
! compress-it
كما في الصورة
 |
اضغط علي الصورة لتكبيرها
انظر الي القطعة المحددة باللون الاحمروهي حجم اكواد قبل الضغط وبعد الضغط وتختلف
من مدونة لاخري ومن قالب لاخر
والي هنا انتهي الموضوع
والسلام عليكم ورحمة الله وبركاته وكان هذا الدرس بناء علي طلب
صديقي اسلام طلعت |
|
بسم الله الرحمن الرحيم وبه نستعين والصلاة والسلام علي اشرف المرسلين حبيبي محمد صلي الله عليه وسلم
اليوم الموافق 3/10/2012 تكمل بلوجر فيس شهرها الثالث علي التوالي ومع انجازات ما اشاء الله
اول انجاز هو ظهورها في محركات البحث بمعني ان تذهب لجوجل الان واكتب بها كلمة بلوجر فيس وستري كما في الصورة
وانضمام شامل كول الينا
وانضمام كاسر بلوجر
واتمام مائة موضوع و 250 تعليق
وشكرا باذن الله انجازات اخري افضل وافضل
والسلام عليكم ورحمة الله وبركاته
بسم الله الرحمن الرحيم وبه نستعين والصلاة والسلام علي اشرف المرسلين سيدنا محمد خير البشر اجميعن ثم اما بعد
اضافة اليوم في غاية الجمال والروعة وانا اذا كان هناك مكان في مدونتي لها لا كنت وضعتها
وهذا الاضافة مكونة من خليط بين css3 التي يعمل بها قالب مدونة بلوجر فيس ولغة البرمجة الاساسية html
انا لن اطيل عليكم ولكني اقول هذا لاستعياب اكثر لمعلمومات انت في بلوجر فيس لاتاخذ اضافة وتذهب بل يجب ان تاخذ معلمومة ايضا وفهم لنذهب للدرس اولا ساريكم مشاهدة حية
مشاهدة حية
لوضع الاضافة في مدونتك اضغط علي الزر الذي بالاسفل
وللتعديل علي الكود ابحث عن
<ul id="tbisose">
<li data-alt="Follow us on Facebook"><a class="icon facebook" href="#">Follow us on Facebook</a></li>
<li data-alt="Follow us on Twitter"><a class="icon twitter" href="#">Follow us on Twitter</a></li>
<li data-alt="Follow us on Google+"><a class="icon googleplus" href="#">Follow us on Google+</a></li>
<li data-alt="Follow us on Pinterest"><a class="icon pinterest" href="#">Follow us on Pinterest</a></li>
<li data-alt="Subscribe with RSS"><a class="icon rss" href="#">Subscribe with RSS</a></li>
</ul>
غير باللون الازرق بالكلمة بجملة اخري حسب ما تريد
واغير علامة# برابط صفحاتك
والي هنا قد انتهي الدرس ارجو ان يكون قد نال اعجبكم واي استفسار انا في الخدمة ومنتظر تقييمكم للموضوع
بسم الله الرحمن الرحيم وبه نستعين والصلاة والسلام علي اشرف المرسلين صلي الله عليه وسلم
موضوع اليوم اعتقد انه بحث عنه الكثير حتي انا كنت ابحث عنه حتي قررت صنع الكود هيا بنا نبداء الدرس
ساريكم مثال حي الان كالعادة
blogger face
انها مفيدة جدا في الشروحات وبالذات في بلوجر
الان سنذهب لنعرف طريقة التركيب
اذهب للوحة تحكم بلوجر
ثم قالب ..تحريرhtml..متابعة.. وابحث عن
]]></b:skin>
باستخدام
Ctrl
+
f
وضع قبلها او فوق الوسم هذا الكود
kbd{
border:1px solid gray;
font-size:1.2em;
box-shadow:1px 0 1px 0 #eee, 0 2px 0 2px #ccc, 0 2px 0 3px #444;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
margin:2px 3px;
padding:1px 5px;
}
وبعدها طريقة التركيب في رسايل المدونة او المواضيع
عن طريق تغير وضع تاليف الي (تحرير html)
ووضع هذ الكود
<kbd>هنا الكلمة المرادة</kbd>
والي هنا قد انتهي الموضوع والسلام عليكم ورحمة الله وبركاته منتظر تقيمكم للموضوع باذن الله نلتقي في موضوع اخر
بسم الله الرحمن الرحيم
في موضوع جديد من موضوعات مدونة بلوجر فيس، نقدم لكم طريقة جديدة لأضافة تغريدات حسابك على تويتر مباشرة في مدونتك بطريقة سهلة و جديدة .
# الطريقة بكل سهولة #
سجل دخولك لحسابك على تويتر ثم أذهب لصفحة أنشاء الأداة من هنا
تابع الخطوات الأتية في تصميم شكل الأداة
1 - أكتب اليوسر نيم للحساب بشكل صحيح
3 - حدد اللون الذي ستظهر به الأداة سواء مظلمة أو فاتحة
4 - ضع علامة صح بجانب المربع الصغير أذا كنت تريد أظهار الصور داخل الغرفة بطريقة طلقائية
5 - حدد لون الروابط الخارجية داخل الغرفة
6 - ضع عنوان مدونتك أو موقعك بشكل صحيح على طريقة
ملحوظة : لا تضع علامات مثل http أو https
7 - أضغط علي حفظ التغيرات - save changes
8 - تابع هذة الخطوات كما هو موضوح في الصورة التالية
بعد ذلك سوف يظهر لك كود بلغة HTML
أنسخ هذا الكود وضعه في أداة جديدة في مدونتك ثم أضغط حفظ للأداة
" بالتوفيق "
بسم الله الرحمن الرحيم وبه نستعين والصلاة والسلام علي اشرف المرسلين ثم اما بعد
السلام عليكم ورحمة الله وبركاته اعتذر عن عدم كتابتي لمواضيع لمدة دامات اكثر من اسبوعين وهذا بسبب اني كنت اصمم القالب انا واصدقائي الاحباء اسامة الاسدي وعبد الغفور بارك الله فيهم وبعدها كنت اخذ دروة php وتقديم ورقي للجامعة وسفري الدائم اليها فانا باذن الله ساكتب بعض المواضيع وبعدها سانقطع قليلا لدراستي....
.. لنكمل الدرس كما رائيتم في مدونة بلوجر فيس في قالبها الجديد
ان اقراء المزيد بتقنية css3.
واقراء المزيد ايضا لها مقاس لقد عدلت علي الاضافة لتعمل في بهذه التقنية التي انا اعشقها جدا.. وسوف اريكم اليوم كيفية تركيبها علي مدونتكم بدلا من الطريقة التقليدية وهي وضع صورة بدون مقدمات كثر لنذهب ونري طريقة التركيب في مدونتكم
ثانيا اتبع التعليمات...
- اخذ نسخة احطايتية من قالبك توقعا لحدوث اي خطا.
- قالب
- تحرير html
- متابعة
- توسيع عناصر وجهة المستخدم
وبعدها ابحث عن هذا الوسم
وقبلها او فوقه تمام اضف هذا الكود
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(a,b){if(a.indexOf("<")!=-1){var s=a.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length)}}a=s.join("")}b=(b<a.length-1)?b:a.length-2;while(a.charAt(b-1)!=' '&&a.indexOf(' ',b)!=-1)b++;a=a.substring(0,b-1);return a+'...'}function createSummaryAndThumb(a){var b=document.getElementById(a);var c="";var d=b.getElementsByTagName("img");var e=summary_noimg;if(d.length>=1){c='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+d[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var f=c+'<div>'+removeHtmlTag(b.innerHTML,e)+'</div>';b.innerHTML=f}
//]]>
</script>
<script type='text/javascript'>
/*طول وعرض الصورة*/
summary_noimg = 550;
summary_img = 450;
/*طول وعرض النص*/
img_thumb_height = 150;
img_thumb_width = 200;
</script>
ثم ابحث عن هذا الوسم واستبدله بالكود التالي
<data:post.body/>
هذا الكود:..
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<div style='clear: both;'/>
<span class='rmlink' style='font-weight:bold;padding:6px;float:right;text-align:right;'><a expr:href='data:post.url' >اكمل الموضوع</a></span>
</b:if>
</b:if>
استبدل كلمة اكمل باي كلمة تريد.
ان ذهب الي الصفحة الرئيسية ستجد الااضافة موجودة الان
سنضيف التاثير علي الاضافة
ابحث عن الوسم التالي وضع قبله او فوقه الكود التالي
]]></b:skin>
/* start read more css3 by blogger face.com */
}.rmlink a{position:absolute;
left:10px;
bottom:10px;
background:#F0F0F0;
border:1px solid #f1f1f1;
border-radius:8px;
box-shadow:0 0 1px white inset,0 0px 3px #B5B5B5;
color:#999 !important;font:13px "tahoma";text-align:center;margin-top:15px;padding:5px 15px 6px 15px;-webkit-transition:background 0.4s ease-in-out;
-moz-transition:background 0.4s ease-in-out;
-o-transition:background 0.4s ease-in-out;
-ms-transition:background 0.4s ease-in-out;
transition:background 0.4s ease-in-out}
.rmlink a:hover{background:#3EA1B2;
border:1px solid #3EA1B2;
border-radius:8px;
box-shadow:0 0 1px #3EA1B2 inset,0 0px 3px #b5b5b5;
color:#fff !important}#b-c-r{background:#2B2B2B;
margin:-2px 0 0 0;
overflow:hidden;
border-top:2px solid gainsboro
;width:1020px}
/*end read more css3 by blogger face.com */
تم بحمد الله عمل الموضوع فان اخطائت فمني ومن الشيطان وان اصبت فهو من الله
والسلام عليكم ورحمة الله وبركاته منتظر تقيميكم واي مساعدة او استفسار انا في خدمتك
وسوم:بلوجر,اكواد,اقراء المزيد,فيس,بوك ,برامج,تصميم,قوالب,فوتوشوب,جوجل,سي اس اس,css,css3
بسم الله الرحمن الرحيم
أعزائي زوار ومتابعي مدونة بلوجر فيس .. هذا اول موضوع لي في المدونة ولانه اول موضوع حبيت اقدم لكم
اضافه جديده على مدونة بلوجر وهي عمل روابط داخليه للموضوع ومصدر الموضوع داخل كل تدوينه بشكل تلقائي مثل المنتديات
مميزاته عمل باك لينك داخل التدوينه + تعطي شكل جميل للتدوينه
للمعاينة
نبدأ الشرح
أولا يجب أن تاخذ نسخة احتياطية من القالب قبل البدء في الشرح
ابحث عن الوسم التالي
<data:post.body/>
(إن وجدت ثنتين فالثانية هي المقصودة) ثم مباشرة بعدها ضع الكود الآتي:
<b:if cond='data:blog.pageType == "item"'><data:post.body/><b:if cond='data:blog.pageType == "item"'><div style="text-align: center;"><span>
<span style='margin:0px;padding:10px 10px 10px 10px;font-family:Arial;font-size: 15px;line-height: 20px;'>رابط الموضوع الاصلي: <a expr:href='data:post.url'><data:post.title/></a></span><span style='margin:0px;padding:10px 10px 10px 10px;font-family:Arial;font-size: 15px;line-height: 20px;'>المصدر: <a expr:href='data:blog.homepageUrl'><data:blog.title/></a></span>
</span></div></b:if>
قم بحفظ القالب وهكذا ينتهي الشرح.
شكر ا ومنتظر تقيمكم للموضوع
بسم الله الرحمن الرحيم به نستعين والصلاة والسلام علي اشرف المرسلين ثم اما بعد ودرس اليوم درس شايق وجميل وحصري
وهو وضع خلفية مطرازة لكل موضوع ساريكم مثال حي الان كالعادة وبعدها ساشرح لكم
اذا اعجبتكم تابعوا معي الشرح
اذا اردت اضافة خلفية لعنوان ضع هذا الكود في مكان عنوان الموضوع
طريقة وضع خلفية لكل موضوع بشكل غير الاخر في بلوجر
<div dir="rtl" style="text-align: right;" trbidi="on"><div dir="rtl" style="text-align: right;" trbidi="on"><div style="-webkit-box-shadow: #13B0B2 0px 0px 0px 4px, rgba(10, 10, 0, 0.496094) 2px 1px 4px 4px; background-attachment: initial; background-clip: initial; background-color: #13b0b2; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-color: #ffffff; border-image: initial; border-style: dashed; border-top-left-radius: 3px; border-top-right-radius: 3px; border-width: 2px; box-shadow: #13B0B2 0px 0px 0px 4px, rgba(10, 10, 0, 0.496094) 2px 1px 6px 4px; color: white; font-size: 21px; line-height: 1.3em; margin: 10px; padding-bottom: 5px; padding-left: 10px; padding-right: 10px; padding-top: 5px; text-align: center; text-shadow: #13B0B2 -1px -1px;">هنا الكلمة المرادة</div>
استبدل الاخضر بالعنوان
باي لون تريد من صفحة اكواد الالوان من هنا
ارجوا ان يعجبكم الدرس وانتظرو امني الجديد المتميز ومنتظر تقيمكم وانتظروا التحديثات في المدونة الجديدة ولاتتفاجئوا اذا اغلقت المدونة والسلام عليكم ورحمة وبركاته
بسم الله الرحمن الرحيم وبه نستعين والصلاة والسلام علي اشرف المرسلين واضافة اليوم اضافة جميلة واعتقد ان الكثير بحثوا عنها كثيرا وحولو حتي تعلم صنع الفلاش وانا الحمد لله وجدت لكم الحل لندخل في الموضوع ولن اطيل عليكم كثيرا لكي لا تملوا مني ساريكم المشاهدة المباشرة الان
مشاهدة مباشرة
اضافة لها اشكال كثيرة وانا ساضع بعضها فقط وهذا الشكل الاول
اذا اردته انسخ الكود الذي بالاسفل وضعه في اداة java scribt
<object type="application/x-shockwave-flash" data="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf" width="250" height="150"><param name="movie" value="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf"></param><param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param><param name="wmode" value="transparent"></param><param name="flashvars" value="username=blogger-face"></param><a href="http://24work.blogspot.com/" title="Blogger Widgets">Blogger Widgets</a><embed src="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="250" height="150" menu="false" wmode="transparent" flashvars="username=blogger-face"></embed></object>
وهذه الشكل الثاني
اذا اردته انسخ الكود الذي بالاسفل وضعه في اداة java scribt
<object type="application/x-shockwave-flash" data="http://www.buzzbuttons.com/BUTTON0/twitbutton.swf" width="250" height="150"><param name="movie" value="http://www.buzzbuttons.com/BUTTON0/twitbutton.swf"></param><param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param><param name="wmode" value="transparent"></param><param name="flashvars" value="username=blogger-face"></param><a href="http://24work.blogspot.com/" title="Blogger Widgets">Blogger Widgets</a><embed src="http://www.buzzbuttons.com/BUTTON0/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="250" height="150" menu="false" wmode="transparent" flashvars="username=blogger-face"></embed></object>
هذا الشكل الثالث
وهذا الكود الخاص به
<object type="application/x-shockwave-flash" data="http://www.buzzbuttons.com/BUTTON4/twitbutton.swf" width="250" height="150"><param name="movie" value="http://www.buzzbuttons.com/BUTTON4/twitbutton.swf"></param><param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param><param name="wmode" value="transparent"></param><param name="flashvars" value="username=blogger-face"></param><a href="http://24work.blogspot.com/" title="Blogger Widgets">Blogger Widgets</a><embed src="http://www.buzzbuttons.com/BUTTON4/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="250" height="150" menu="false" wmode="transparent" flashvars="username=blogger-face"></embed></object>
بسم الله الرحمن الرحيم وبه نستعين والصلاة والسلام علي اشرف المرسلين واليوم مع درس واضافة يبحث عنها الكثيروهي صندوق تضع به رابط حسابك علي تويتر وفيس بوك وفيد بنر (rss) وبتقنية css لن اطيل عليكم كثيرا لنبداء الدرس وقبل البداء ساريكم مشاهدة حية كالعادة
مشاهدة مباشرة
اذا اعجبتك وتريد اضافتها اترك تعليق قبل ان تذ هب 
واضغط علي الزر الذي بالاسفل
بسم الله الرحمن الرحيم وبه نستعين والصلاة والسلام علي اشرف المرسلين ثم اما بعد اضافة اليوم اضافة جميلة جدا جداسوف تعجب الجميع اذن الله وانا نفسي ساضع منها في مدونتي وهي عبارة عن اداة مثل المشاركات الشائعة الموجودة في مدونتي ولكن زيادة بها ميزاتان اولهما تحت كل عنوان موضوع عداد للتعليفات وتاريخ نشر الموضوع وهذا يسهل عليك الكثير ساريكم مثال حي كالعادة
مشاهدة مباشرة
اذا اعجبتك اكتب تعليق واضغط علي الزر الذي بالاسفل :)
