الخميس، 27 نوفمبر 2014

نصائح ستجعلك ناجحا في مجال تدوينك

بقلم: BR MED يوم الخميس، 27 نوفمبر 2014 القسم : | 2 التعليقات
 السلام عليكم و رحمة الله و بركاته،
مجال التدوين يعتبر من الأولويات التي على المدون إختيارها بعناية ، لبناء مشروعه على الويب، فأغلب المدونات تفتقد لهذه الخاصية ، لم أقل الكل و لكن معظمها فمثلا هناك من ينشئ مدونة بدون تفكير مسبق عن ماذا سيدون !؟ فتجده ينشر مقالة عن البيئة و أخرى عن الأنترنيت و أخر عن تاريخ الإسلام، و ينشر مقالات لن يكسب بها متابعين مهتمين أبدا و لن يذهب بعيد في هذا المجال حتى يجد نفسه ينسخ فقط من أجل ملئ المدونة بالمواضيع... فكل عمل أو مشروع بدون دراسة دقيقة تكون نهايته هي الفشل.

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

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

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

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

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

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

أتمنى أن تكون قد إستفدت من الدرس بشكل جيد، و بالتوفيق للجميع،أي إستفسار أنا بالخدمة دمتم بود.
إقرأ البقية

الاثنين، 24 نوفمبر 2014

مقارنة بين أفضل و أشهر منصات التدوين على الويب

بقلم: BR MED يوم الاثنين، 24 نوفمبر 2014 القسم : 0 التعليقات
 السلام عليكم و رحمة الله و بركاته
 بعد أن كان الموضوع السابق " نظرة شمولية عن التدوين و المدونات " فبعد الإستيقاظ من كابوس المنتديات و مواقع التواصل الإجتماعي تغيرت نظرتنا لشبكة الإنترنيت وصرنا نسعى لفرض وجودنا و هويتنا فيه، ومع شروق فن جديد وهو فن التدوين الألكتروني، جئت اليوم كي أقربكم من أهم منصات التدوين وأشهرها التي تمكنك من عمل موقعك بسهولة و إدارته بدون أدنى صعوبات .

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

1- wordpress
منصة الوردبريس الغنية عن كل تعريف و هي برنامج يمكنك من إنشاء مدونات و إدارتها تتميز هذه المنصة بالسهولة و المجانية و توجد نسخة متطورة مدفوعة أهم نقاط القوة و الضعف فيها هي كالتالي:
  •  نقاط القوة :
- تحميل سكريبت مجاني .
- نظام السيو قوي و ظهور في محركات البحث.
- حرية تامة في التحكم في محتواك عليها. ولا أحد يمكن الوصول إليه.
- توفر على قوالب جميلة مدفوعة و مجانية.
- يمكنك ربطها بإستضافة مستقلة مدفوعة.
- هناك سكريبت وردبريس و مدفوع أكثر تطورا.
- حاوالي %16  من مواقع العالم تستعملها كمنصة.
  • نقاط الضعف :
- معقدة من ناحية تحميل ملفات المدونة بالنسبة للمبتدئين.
- بعض شركات الإستضافة لا تقبلها.
- نظام حماية ضعيف يمكن إختراقها حتى مع وجود إضافات مدفوعة للحماية، فالأمر ممكن في أي لحظة،
- صعوبة القبول في برنامج جوجل أدسنس.
- تحتاج إستضافة مدفوعة (كونك مبتدئ لا تفكر حتى في الأمر)

 2- blogger
منصة البلوجر هي المنصة الأولى في العالم إلى لحظة كتابتي هذا الموضوع، و هي من أحد منتوجات العملاق جوجل، و هي منصة تمكنك من وإنشاء مدونة و إدارتها في دقائق معدودة ، تتميز بالإحترافية و مجانيتها طبعا، و الآن سوف نقف عند نقاط القوة و الضعف لدى هذه المنصة.
  • نقاط القوة :
- فقط حساب على جوجل يمكنك من إنشائها في دقائق معدودة
- يمكنك إنشاء مدونات متعددة.
- منصة مرفوعة على سيرفرات جوجل نادرا ما تقع مشكلة بالسيرفر و حتى إن وقع ف ثانيتين  تكفي لتعود من جديد
- منصة محصنة و محمية بشكل جيد ، إختراقها يقارب المستحيل (كل ما عليك هو حماية حسابك جيميل).
- تتوفر على قوالب جميلة مدفوعة و مجانية يكفي البحث جوجل أو دخول قسم القوالب في مدونتي.
- لا تحتاج إستضافة إلا إن أردت أن تحجز لها دومين مدفوع.
- توفرها على سيو و أرشفة سريعة و قوية في محركات البحث.
- مدعومة من طرف جوجل أدسنس
  • نقاط الضعف :
- إمكانية وصول جوجل إلى محتوى المدونة قد تقوم بحذف موضوع أو حتى المدونة بأكملها، هذا لم يقع سابقا و لكن وصول جوجل إلى هذه المرتبة اليوم لم يأتي بمحض الصدفة و لكن جاء بالإضباط و وبنود و مبادئ فلا يمكن لجوجل أن تدعك تروج لشيء مخالف للقوانين و مضر للمستخدمين فتلقي العديد من الإبلاغات عن مدونتك سيجعلك في المشاكل.
- واجهاتها ليست إحترافية كفاية .
- التحكم في الشكل و الأقسام يتطلب خبرة في لغات البرمجة.
- بطيئة في التصفح نوعا ما.
- للأسف محظورة من بعد الدول.

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

الأربعاء، 19 نوفمبر 2014

أكواد التحكم في إخفاء و إظهار الأدوات في صفحات المدونة

بقلم: BR MED يوم الأربعاء، 19 نوفمبر 2014 القسم : 2 التعليقات
السلام عليكم ورحمة الله وبركاته
في مجال التدوين أو تنسيق القوالب يضطر الشخص للتعديل على أشياء كثيرة من أجل تحسين صورة و أداء مدونته أو موقعه مثل ضبط مكان الأضافات، الصور، الروابط، الستايل،  و جعلني أقوم بنشر هذه التدوينة هي كثرة الأسئلة حولها حيث دائما يتم سألي كيف يتم ذلك؟ و كيف يمكنني ذاك؟ قررت جمع هذه الأكواد التي تعتبر من الأولويات التي يجب على المدونين و مدراء المواقع ضبطها.
هذه الأكواد هي كالأتي
هذه المجموعة تخص إظهار الأدوات في صفحة معينة فقط
إظهار الأداة في الصفحة الرئيسية فقط
 <b:if cond='data:blog.url == data:blog.homepageUrl'>
جعل أكواد الأداة هنا
</b:if>
إظهار الأداة في صفحات التدوينات فقط
 <b:if cond='data:blog.pageType == "item"'>
جعل أكواد الأداة هنا
</b:if>
إظهار الأداة في الصفحات الثابتة فقط
 <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
جعل أكواد الأداة هنا
</b:if>
إظهار الأداة في رابط معين
 <b:if cond='data:blog.url == "رابط الصفحة"'>
جعل أكواد الأداة هنا
</b:if>
هذه الأكواد كلها تتحكم في إظهار الأدوات و الإضافات حسب المكان الذي خصص لها من طرف الكود.الآن سوف نرى طريقة عكس هذه الأكواد أو جعلها مخصصة لإخفاء الأدوات في منطقة صفحة معينة فقط.و ذلك بطريقة سهلة كل ما عليك هو إستبدال الرمز (=) الأحمر الموجود داخل الكود بـ علامة التعجب (!) ليصبح شكل الكود كما يلي:
<b:if cond='data:blog.url != data:blog.homepageUrl'>
جعل أكواد الأداة هنا
</b:if>
مثلا هذا الكود الذي قمنا بإنشائه هو يقوم بإخفاء الأدوات من الصفحة الرئيسية فقط و بالتالي يمكنها الظهور في مجمل الصفحات الأخرى.
أما طريقة إستخدامها على الإضافات فهي سهلة جدا إذا كانت الأداة التي تود التحكم بها بانر أو شفرة إعلانية أو أكواد سلايدر مثلا فكل ما عليك فعله هو إستبدال عبارة "جعل أكواد الأداة هنا" بكود البانر أو الأعلان .
أما بالنسبة للأدوات التي تضاف من صفحة التخطيط فما عليك هو التوجه للقالب و البحث عن إسم الأداة ستجد أسفلها هذا الكود:
<b:includable id='main'>
ثم بعده مباشرة سوف نضع السطر الأول من الكود الذي نرغب أن نطبقه على الأداة ، بعد ذلك سوف ننزل قليلا سوف نجد هذا الكود:
<b:include name='quickedit'/>
ثم نضع مباشرة الوسم </b:if> الموجود بالسطر الثالت من الكود المستعمل
 في بعض الأحيان سوف تجد الوسم : </div> بعد <b:include name='quickedit'/> و بالتالي سوف نضع وسم الإغلاق </b:if>
يمكنك الأعتماد على هذا الفيديو
 هذا كل ما في موضوع اليوم بالتوفيق للجميع في أمان الله
إقرأ البقية

الثلاثاء، 18 نوفمبر 2014

حل مشكلة عدم التحكم في عدد المشاركات داخل التسميات

بقلم: BR MED يوم الثلاثاء، 18 نوفمبر 2014 القسم : 2 التعليقات
السلام عليكم ورحمة الله وبركاته.
عدد المشاركات في واجهة المدونة من بين الأمور التي تتحكم في سرعة تحميلها أثناء التصفح، لهذا أنصح دائما بعدم جعلها أكثر من 15 مشاركة، وهذا لزيادة سرعة التصفح و عدم جعل الزائر ينتظر وقت تحميل المعطيات للتنقل بين الصفحات ، و المهم بعد تعديل إعدادات المشاركات بما يناسبيك ، قد تواجه مشكلة و هي أنا عدد المشاركة التي تظهر في عند دخول إلى تسمية من التسميات يخالف ما قد خصصه للصفحة الرئيسية، و موضوع اليوم جاء خصيصا لحل مشكلة عدد التدوينات في التصنيفات أو التسميات و التي تعتمد روابطها في إنشاء القائمة الإفقية أو ما يسمى النافبار مما يجعل المشكلة فيها أيضا. و لمعالجة هذا المشكل إتبع الخطوات التالية:
1- الدخول للوحة التحكم في البلوجر ثم القالب نأخد نسخة إحتياطية للقالب بعدها تحرير html .
2- ننقر في وسط الأكواد ثم نبحث بالأستعانة بـ ctrl+f عن هذا الكود:
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
ملاحظة : هذا الكود قد يكون مكررا ويجب تغير الكل و في حالة لم تكن أداة التسميات بالقالب فلن تجد الكود.

3- ونقوم بإستبداله  بهذا الكود:
<a expr:href='data:label.url + &quot;?max-results=7&quot;'><data:label.name/></a>
*الرقم 7 هو عدد التدوينات التي ستظهر يفضل أن تجعلها بنفس عدد التدوينات في الصفحة الرئيسية. 
4- أما بالنسبة للتسميات التي تظهر أسفل التدوينة أو داخلها فقم بالبحث عن هذا الكود وقم بإستبداله بالكود السابق.
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
 هذا كل ما في موضوع اليوم أي صعوبة إترك تعليق أسفل الموضوع،دمتم بود.
إقرأ البقية

الاثنين، 17 نوفمبر 2014

شبكة أدسنس بين صعوبة الإنتساب و سهولة الحظر

بقلم: BR MED يوم الاثنين، 17 نوفمبر 2014 القسم : 0 التعليقات
السلام عليكم ورحمة الله وبركاته
عند حديثنا عن مسألة الربح من  بلوجر، لابد أن نذكر جوجل أدسنس، و كتعريف لهذه الأخيرة، فهي شبكة إعلانية تابعة لشركة جوجل العملاق ، فهي تستقبل طلبات المعلنين مثل أصحب الشركات و المنتوجات أو المواقع... بحيث يقوم المعلن بإنشاء حملة إعلانية عليها و من تم يقوم بالدفع حسب النقرات على إعلانه، و كطرف ثالث عندما ينتسب الناشر أو صاحب الموقع لهذه الشبكة الإعلانية تقوم تلك الإعلانات بالظهور على موقعه أو فديوهاته على اليوتيوب و يتم إستلام دفعاته و ذلك من خلال عدد النقرات و عدد مرات ألف ظهور، و بالتالي الأطراف الثلاثة تكون مستفيدة بحيث الناشر و أدسنس يحصلون على المال و المعلن بحيث الترويج لمنتوجه.
ولكن المشكل يكمن في صعوبة الإنتساب لهذه الشبكة الإعلانية بسبب صرامة قوانينها و سياستها.
و اليوم سوف أشرح شروط القبول في برنامج أدسنس + أساسيات القبول بسرعة + ظوابط لتجنب الحظر.

شروط القبول في برنامج أدسنس.
← يجب على موقعك عدم إنتهاك الملكية الفكرية مثلا توفير مقاطع موسيقية أو أفلام أو كتب أو الأنيمي أو الصور المحفوظة بحقوق الطبع والنشر.
← تجنب نشر المعلومات الشخصية المتعلقة بالأفراد مثل الصور، إيمايلات، أرقام الهاتف، مكان السكن، أرقام بطاقة الإئتمان أو الوثائق التعريفية الإدارية.
← شرحات إختراق أو تفعيل البرامج و الألعاب (الكراك - الكايجن - السريال).
← عدم التطرق لمواضيع تخص الإختراق و لو بأي شكل من الأشكال.
← أن لا يكون موقعك خاص بالبث الحي أو بث المباريات لأن ذلك إنتهاك للملكية .
← أن لا يكون محتوى مدونتك يحرض على العنف و العنصرية أو الإضطهاد.
← أن يكون عمر المدفوع لإمره 18 سنة على الأقل.
← أن لا يكون المحتوى جنسي و تجنب الإحالة لها.

 أساسيات القبول بسرعة.
← أن يكون عمر موقعك أو مدونتك على الأقل 3 أشهر.
← أن يكون موقعك يتوفر على 20 صفحة و ليس موضوع كما يزعم البعض .
← أن تكون مواضيع موقعك حصرية و غير منقولة من مواقع أخرى.
← أن يكون موقعك بتصميم و تنسيق إحترافي (تجنب كثرة الألوان و الإضافات).
← أن تكون لديك سياسة الخصوصية بموقعك .
← يفضل أن يكون موقعك على دومين أو إستضافة مدفوعة لكسب المزيد من الثقة .
← أن تكون لديك مصادر مختلفة من الزوار .
← يفضل أن يكون الإيميل الذي سوف تراسلهم به بنفس إسم الإستضافة الخاصة بك مثلا : contact@warch-mo.net بالنسبة لمدونتي.

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

الجمعة، 14 نوفمبر 2014

نظرة شاملة عن التدوين و المدونات

بقلم: BR MED يوم الجمعة، 14 نوفمبر 2014 القسم : 0 التعليقات

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

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

المدونة :
المدونة هي موقع أو صفحة ويب مرتبطة بشخصية صاحبها، يقوم صاحبها (المدون) بإدراج تدوينات و تسمى أيضا مداخلات، تظهر على واجهة الموقع و تكون على شكل نصوص أو صور أو فيديوهات، و تعرض بتسلسل زمني بحسب تاريخ نشرها فتظهر الحديثة في الأعلى وكلما نشرت تدوينات جديدة إلى وتقوم بإزاحة القديمة نحو الأسفل، أما بالنسبة للتدوينات فهي تصنف حسب الأقسام و تسمى أيضا التسميات بحيث تجد العديد من التدوينات بقسم معين ، مثلا عندما تكتب تدوينة عن الرياضة تقوم بتصنيفها ضمن الرياضة بحيث كل التدوينات التي تحدث فيها عن الرياضة أو ماشبه ستجدها في قسم الرياضة، هناك نقطة مهمة أخرى وهي أنا كل مداخلة أو تدوينة تتوفر على الرابط الخاص بها مثلا هذه التدوينة التي تقرأها الآن لديها رابط على هذا الشكل:
 http://warch-mo.blogspot.com/2014/11/blog-and-bloging.html لا يمكن أن يتغير فهو يبقى دائما على شبكة الإنترنيت إلا في حالة إن قمت بحذف التدوينة أو المدونة عامة.

الفرق بين التدوين بمدونة و التدوين بالمنتديات:
- أولا سوف نقف عند المنتديات هذه الأخيرة لا يمكنك أن تدون بحريتك و فتنشر ما تشاء وتعبر عن أفكارك و أرائك كما هي سياسة المنتدى، تكون دائما مقيدا بقوانين مشرفي و مراقبي المنتدى و تكون دائما مهدد بالحظر، أحيانا تخصص جهدا وقتا ثمينا كي تكتب مقالة أو موضوع معين  قصد نشره بالمنتدى وفي الأخير يقوم المراقب بإخفاءه  أو حذف، ليس هذا فقط فأحيانا تجد عضو مجد منظم للمنتدى أربع سنوات أو أكثر وفي رصيده 600 مشاركة أو أكثر ومع كل هذا أي خلاف بينه وبين أحد مسؤولي المنتدى قد يتم حظر بدون مراعات المساهمات التي قدمها للمنتدى ولدي صديقي يعمل مبرمج و قع له نفس المشكل و الآن أصبح يتعامل مع الغربين بكثرة هذا كله بسبب الأستبداد الذي لازال مختلطا بدم العرب للأسف، رغما كل هذا فقد يراني البعض منكم أني حولت مراقبي و مشرفي المنتديات إلى أشرار ^_^ ولكن أنا أتكلم حسب تجربتي أنا وبعض الأصدقاء ... هناك مسألة أخرى وهي كون أغلب المنتديات تكون فضاء للمناقشة فقط وهناك أخرى إزعاج إعلاناتها أكثر من منفعتها، و لا أنكر أن هناك منتديات متخصصة راقية وإستطاعت أن تنجح و تكون مثلا لغيرها.

- أما بخصوص المدونات فهنا يكون المدون أو الناشر أكثر حرية في التعبير على نفسه كما يريد، فالمدونة تكون مرآة تعكس شخصيتك و أسلوب تفكيرك،لا قيود لا قمع للأراء أو الأفكار فلك حرية التعبير بمعناه الحقيقي،  ففي هذه الحالة أنت بمثابة ملك على مدونتك، إلا في حالة كانت مدونة جماعية أي تضيف أحد أصدقائك المقربين جدا أو أقاربك لتشتغلو بشكل جماعي على إدارة مشروعكم،

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

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

الاثنين، 10 نوفمبر 2014

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

بقلم: BR MED يوم الاثنين، 10 نوفمبر 2014 القسم : 2 التعليقات
السلام عليكم و رحمة الله وبركاته
متابعي ورشة مدون الأوفياء كما عودناكم دائما بالجديد و الحصري , اليوم في هذا الموضوع سوف نرى كيفية إضافة أدآة "الموضوع السابق" و "الموضوع التالي" أو ما يسمى ب "navigation pager" و سوف نعتمد على أكواد jquery لنستطيع إظهار عناوين المواضيع , هذه الطريقة شبيهة بطريقة عمل السلايدرات. وتعتبر هذه الأضافة من الأدوات التي تساعد على بقاء الزائر في المدونة أطول مدة ممكنة.
على بركة الله نبدأ الشرح:
 أولا قبل أن نقوم بأي خطوة نأخذ نسخة إحتياطية للقالب تحسبا لأي خطأ أو في حالة لم تعجبك الإضافة

1- كخطوة أولى نقوم بالذهاب للوحة التحكم ثم القالب ثم تحرير html
2- نبحث عن هذا الوسم : ]]></b:skin>
3- نضع فوقه هذا الكود مباشرة:
/*################warch-mo.blogspot.com Pager ##########################*/
.warch-mo-pager { border-top: 2px dashed #ddd; border-bottom: 2px dashed #ddd; overflow:hidden; padding:0px;}
.warch-mo-pager li.next { float: right; padding:0px; background:none; margin:0px;}
.warch-mo-pager li.next a { padding-left: 24px; }
.warch-mo-pager li.previous { margin:0px -2px 0px 0px; float: left;  border-right:1px solid #ddd; padding:0px; background:none;
}
.warch-mo-pager li.previous a { padding-right: 24px;  }
.warch-mo-pager li.next:hover, .warch-mo-pager li.previous:hover  {background:#646464; }
.warch-mo-pager li { width: 50%; display: inline; float: left; text-align: center; }
.warch-mo-pager li a { position: relative; min-height: 77px; display: block; padding: 15px 46px 15px; outline:none; text-decoration:none;}
.warch-mo-pager li i { color: #ccc; font-size: 18px; }
.warch-mo-pager li a strong { display: block; font-size: 20px; color: #ccc; letter-spacing: 0.5px; font-weight: bold; text-transform: uppercase; font-family:oswald, sans-serif, arial; margin-bottom:10px;}
.warch-mo-pager li a span { font-size: 15px; color: #666;  font-family:Droid Arabic Kufi; margin:0px;}
.warch-mo-pager li a:hover span,
.warch-mo-pager li a:hover i { color: #ffffff; }
.warch-mo-pager li.previous i { float:left; margin-top:15%; margin-left:5%; }
.warch-mo-pager li.next i { float: right;
margin-top: 15%;
margin-right: 5%; }
.warch-mo-pager li.next i, .warch-mo-pager li.previous i ,
.warch-mo-pager li.next,  .warch-mo-pager li.previous{
-webkit-transition-property: background color; -webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-out;
-moz-transition-property: background color; -moz-transition-duration: 0.4s; -moz-transition-timing-function: ease-out;
-o-transition-property: background color; -o-transition-duration: 0.4s; -o-transition-timing-function: ease-out;
transition-property: background color; transition-duration: 0.4s; transition-timing-function: ease-out; }
.fa-chevron-right {padding-right:0px;}
.fa-chevron-left:before {
content: "\203A";
}
.fa-chevron-right:before {
content: "\2039";
}
.warch-mo-pager li.previous i {
color: #CCCCCC;
font: 45px tahoma;
margin-top: 25px;
}
.warch-mo-pager li.next i {
color: #CCCCCC;
font: 45px tahoma;
margin-top: 25px;
}
#646464  الغامق هو لون الأظافة عند تمرير الماوس
ffffff# هو لون الكتابة عند تمرير الماوس
4- الآن نقوم بالبحث عن هذا الوسم: <head>
ثم نضع بعده هذا الكود مباشرة

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'/>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet'
type='text/css'/>
<link href='https://dl.dropboxusercontent.com/s/9sfmn9gnslt17ga/warch-mo-Droid%20Arabic%20Kufi.css' rel='stylesheet' type='text/css'/>
الكود المضغوط باللون الأحمر يمكنك مسحه إن كان قالبك يتوفر على مكتبة جيكوري.

5- الأن نبحث عن هذا الكود : <data:post.body/>
ستجد إثنين أو أكثر الثاني أو الثالث هو المقصود قم بتجربتهم كلهم.
نضع أسفله مباشرة هذا الكود:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<ul class='warch-mo-pager'>
        <li class='next'> 
<b:if cond='data:newerPageUrl'> 
<i class='fa fa-chevron-right'/><a class='newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' rel='next'/> 
<b:else/> 
<i class='fa fa-chevron-right'/><a rel='next'><strong>Next</strong> <span>أنت تتصفح أحدث موضوع</span></a> 
</b:if> 
</li>
    <li class='previous'> 
<b:if cond='data:olderPageUrl'> 
<i class='fa fa-chevron-left'/><a class='older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' rel='previous'/> 
<b:else/> 
<i class='fa fa-chevron-left'/><a rel='previous'><strong>Previous</strong> <span>أنت تصفح أول موضوع</span></a> 
</b:if> 
</li>
    </ul>

<script type='text/javascript'> 
//<![CDATA[ 
(function($){    
    var newerLink = $('a.newer-link'); 
    var olderLink = $('a.older-link'); 
    $.get(newerLink.attr('href'), function (data) { 
     newerLink.html('<strong>Next</strong> <span>'+$(data).find('.post h2').text()+'</span>');    
    },"html"); 
    $.get(olderLink.attr('href'), function (data2) { 
     olderLink.html('<strong>Previous</strong> <span>'+$(data2).find('.post h2').text()+'</span>');    
    },"html"); 
})(jQuery); 
//]]> 
</script>
      </b:if></b:if>

هنا تكمن الصعوبة مكان .post h2 المكرر مرتين
يجب تغيره بمعرف عناوين مواضيعك في الصفحة الرئيسية
قم بالتحديد عليه بإستخدام متصفحك أو أداة firebug
هذه بعد الأمثلة :
.post h3.post-title
.post h3
.post h1
.post h2
.post h1.post-title
إن واجهت أي مشكلة إترك تعليق
هنا أتممنا المهمة و نجحت معنا الإضافة.
ملاحظة: في حالة ظهور  كلمة السابق و التالي مرتين في مكان أخر مثلا تحت صندوق التعليقات 
ماعليك سوى البحث على هذا الكود أو جزء منه 
<div class='blog-pager' id='blog-pager'>
   <b:if cond='data:newerPageUrl'>
     <span id='blog-pager-newer-link'>
     <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
     </span>
   </b:if>
   <b:if cond='data:olderPageUrl'>
     <span id='blog-pager-older-link'>
     <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
     </span>
   </b:if>
   <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
   <b:if cond='data:mobileLinkUrl'>
     <div class='blog-mobile-link'>
       <a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
     </div>
   </b:if>
</div>
<div class='clear'/> 
بعد أن تجده تقوم بوضعه بين هذه الأكواد التالية مستعينا بالنوتباد أو البلوك نوت
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
ضع الكود الذي وجدته هنا
</b:if></b:if>
بعد التعديل عليه تقوم بإستبدال الكود الذي بحث عنه سابقا بهذا الإخير الذي أنشأته.
أي إستفسار أنا في الخدمة فقط إترك تعليق
هذا كل ما في موضوع اليوم أتمنى التوفيق للجميع في أمان الله.
إقرأ البقية

الجمعة، 7 نوفمبر 2014

أهم قواعد جعل قوالب بلوجر متجاوبة مع جميع الأجهزة

بقلم: BR MED يوم الجمعة، 7 نوفمبر 2014 القسم : | 2 التعليقات
السلام عليكم و رحمة الله وبركاته 
في زماننا هذا قد نلاحظ كيف إقتحمت الأجهزة الذكية عالمنا ، سواء الهواتف الذكية ، الألوح أو حتى الحواسيب المحمولة، و قد بسطت للكثيرين كل ما كان يقتصر على الحواسيب ، فالولوج للإنترنيت و تصفح المواقع أصبح في متناول الجميع في كل وقت وكل مكان فيمكن لأي شخص ركوب الحافلة للذهاب للجامعة أو للعمل مثلا ، و يستغل الوقت لتصفح موقعك إن كان من المهتمين بما تقدمه ، غالبا المواقع الإخبارية التي إحتلت مكان الجرائد ، و مع إزدياد عدد مستخدمين هذه الأجهزة أصبح مدراء المواقع يسعون وراء جعل قوالب مواقعهم و مدوناتهم متجاوبة  مع كل الألواح و الهواتف بمختلف مقاسات الشاشة و اليوم سوف نرى طريقة جعل القالب متجاوب ، أو ما يعرف ب "Responsive design" و ذلك بتقنية css3 ، والآن على بركة الله، ننتقل إلى الدرس
أولا نقوم بالبحث عن الوسم <head>
ثم نضع هذا الكود بعده مباشرة
<meta content='width=device-width, initial-scale=1.0, maximum-scale=12.0, minimum-scale=.25, user-scalable=yes' name='viewport'/>

الآن نبحث عن هذا الوسم ]]></b:skin>
ثم نضع فوقه مباشرة هذا الكود:
Responsive styles
******************************************/
@media screen and (max-width : 1280px) {
/* CSS FOR NETBOOK AND DESKTOP ------------*/
}
@media screen and (max-width : 1024px) {
/* CSS FOR TABLETS ------------*/
}
@media screen and (max-width : 768px) {
/* CSS FOR SMALL TABLETS ------------*/
نمودج الألواح الصغيرة
}
@media screen and (max-width : 640px) {
/* CSS FOR IPHONE ------------*/
}
@media screen and (max-width : 480px) {
/* CSS FOR MOBILES ------------*/
}
@media screen and (max-width : 320px) {
/* CSS FOR SMALL OLD MOBILES ------------*/
نمودج الهواتف الصغيرة
}
/***************************************************
 إن دققت النظر في هذا الكود سوف تلاحظ أنه يحتوي على عناصرمختلفة مقاسات مختلفة منها سطح المكتب ثم الألواح ثم الألوح الصغيرة ثم الأيفون ثم الهواتف ثم الهواتف الصغيرة في الأخير و هي بمقياس 320px كأقصى عرض.

*شاهد بعض أحجام الشاشات 
iPhone 5 portrait · width: 320px
iPhone 5 landscape · width: 568px 
  iPhone 6 portrait · width: 375px
iPhone 6 landscape · width: 667px 
iPhone 6 Plump portrait · width: 414px 
iPhone 6 Plump landscape · width: 736px 
Crappy Android portrait · width: 240px 
 Crappy Android landscape · width: 320px
Android (Nexus 4) portrait · width: 384px 
 Android (Nexus 4) landscape · width: 600px
 iPad portrait · width: 768px
iPad landscape · width: 1024px
========== 
portrait = عمودي
landscape =  أفقي
=================
الأن سنقوم بالتجربة على شاشة الهواتف الصغيرة، ماسنفعل هو التعديل على أهم المقاسات لعناصر البلوجر وهي كالأتي:
 body : وهو جسم القالب الرئيسي.
outer wrapper : وهو الغلاف الخارجي وداخله توجد كل العناصر.
header : وهو الجزء العلوي من القالب.
main wrapper : وهو الجزء المجمع للتدوينات في  الرئيسية .
post : وهو  التدوينات المصغرة.
sidebar : وهو الشريط الجانبي الذي يحتوي على العديد من الإضافات.
footer : وهو الجزء السفلي من القالب ويسمى أيضا بذيل الموقع نجد به بعض الأضافات أو حقوق القالب.
قد تختلف تسمية المعرفات من قالب إلى أخر لدى أطلب منكم مراجعة عناصركم بشكل دقيق فمثلا لا نجد sidebar ولكن نجد sidebar1 أو sidebar-warpper
الآن سوف نقوم بتحديد أي قياس للشاشة للعمل عليه مثلا أريده أن يكون مناسب للألواح الإلكترونية الصغيرة
شاهد المثال:
#outer-wrapper{width:768px;margin:0px auto;padding:0;overflow:hidden;}
#header{width:768px;margin:0 auto;padding:0;float:none}
#main-wrapper{width:768px;float:right;margin:0;padding:0;overflow:hidden;}
#footer{width:768px;float:none;margin:0 auto;padding:0;overflow:hidden;}
#sidebar-wrapper{width:768px;margin:0 auto; float:none;}
.post{  width:320px ;margin:0 auto;}
إنتبه لمقاسات العرض لم تتجاوز 768px كحد أقصى
كما قلت سابقا المعرفات التي إعتمدتها في هذا النموذج يمكن أن تجدها مغايرة لنمودجك ، فيمكنك التعديل على المعرفات بهذا المثال
 كما يمكنك أن تعدل على القوائم و الشعار و أجزاء ثانوية تختلف من قالب إلى أخر، كما يمكنك أيضا إخفاء أي جزء من القالب في الحقيقة قد يكون الدرس صعب لدى أنصحك بأن تكون لديك دراية ولو قليلة  بلغة html و css3 .

هذا نمودج الهواتف الصغيرة
#outer-wrapper{width:320px;margin:0px auto;padding:0;overflow:hidden;}
#header{width:320px;margin:0 auto;padding:0;float:none}
#main-wrapper{width:320px;float:right;margin:0;padding:0;overflow:hidden;}
#footer{width:320px;float:none;margin:0 auto;padding:0;overflow:hidden;}
#sidebar-wrapper{width:320px;margin:0 auto; float:none;}
.post{  width:320px ;margin:0 auto;}
 عند إختيار النمودج الخاص بنا نقوم بوضع  أكواده في المكان المناسب مثلا هذا الأخير نضعه مكان عبارة نمودج الهواتف الصغيرة بالكود السابق بعد مسح العبارة طبعا و أي تعديل أو إضافة ستقوم بوضعها مع الأكواد في نفس القسم.
يمكنك الإعتماد على هذا الموقع لمعاينة الشكل موقعك في مختلف الأجهزة
mobile responsive
أو يمكنك تصغير نافدة المتصفح بشكل يدوي للمعاينة
كان هذا هو درس اليوم  أي إستفسار أنا في الخدمة ما عليك سوى ترك تعليق
أتمنى التوفيق للجميع في أمان الله
إقرأ البقية