‏إظهار الرسائل ذات التسميات خطوط. إظهار كافة الرسائل
‏إظهار الرسائل ذات التسميات خطوط. إظهار كافة الرسائل

أسهل طريقه لتغير خط مدونتك على بلوجر إلى خط عربى إحترافى جديد

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

جربنا كثيرا كل خط من هذه الخطوط الأجنبيه حتى نجد خطا ملائما للتدوين العربى , ولكننا لم نجد أى منهم يصلح للتدوين باللغه العربيه , ولكن جوجل لم تترك المدونين العرب طويلا بدون طرحها لبعض الخطوط العربيه التى تساعدهم على تحسين وتغيير شكل محتواهم .

وجوجل تقدم لنا الآن 6 خطوط عربيه جديده وهى :
  1. Amiri
  2. Droid Arabic Kufi
  3. Droid Arabic Naskh
  4. Lateef
  5. Scheherazade
  6. Thabit
وحتى أسهل عليكم , ها هى الخطوط السته وأشكالهم فى الصور
Amiri
Droid Arabic Kufi
Droid Arabic Naskh
Lateef
Scheherazade
Thabit

والآن كيف نستخدم هذه الخطوط فى مدوناتنا على بلوجر ؟

تنقسم الخطوات إلى شقين
الشق الأول : إضافة رابط الخط
إفتح أكواد HTML الخاصه بقالب مدونتك , ثم قم بالبحث عن الكود التالى
<head>
 وضع تحته مباشرة الكود الخاص بالخط وهو كالتالى للخطوط السته على التوالى

ملحوظه : عليك بوضع السطر الخاص بالخط المطلوب فقط وليس كل الخطوط .
<link href='http://fonts.googleapis.com/earlyaccess/amiri.css' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/earlyaccess/droidarabickufi.css' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/earlyaccess/lateef.css' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/earlyaccess/scheherazade.css' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/earlyaccess/thabit.css' rel='stylesheet' type='text/css'/>
الشق الثانى : تعديل نوع الخط فى الجزء الذى تريد تغييره
والآن تستطيع تغيير الخط على كل أجزاء المدونه , فقط عليك معرفة كود الجزء المراد تغيير الخط فيه , وإليك شكل أكواد CSS الخاص بكل خط من الخطوط السابقه وبنفس الترتيب

ملحوظه : عليك إستخدام كود واحد من الأكواد التاليه , وإختر هذا الكود على أسس إختيارك لكود نوع الخط السابق .
font-family: 'Amiri', serif;
font-family: 'Droid Arabic Kufi', serif;
font-family: 'Droid Arabic Naskh', serif;
font-family: 'Lateef', serif;
font-family: 'Scheherazade', serif;
font-family: 'Thabit', serif;
وأخيرا يمكنكم الإستعانه بهذه الصفحه , وهى الصفحه الرئيسيه الخاصه بجوجل والتى تقدم هذه الخطوط .
الأربعاء, فبراير 06, 2013

كَيفِية كِتَابة التَّشْكِيل فى اللُغَه العَرَبيه على ( لَوحَةِ المفاتيح ) الكِيبورد

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

هذه هى إختصارات علامات التشكيل على الكيبورد ( لوحة المفاتيح ) وهى سهله جدا :

  • الضمه Shift + E
  • السكون Shift + X
  • الفتحه Shift + Q
  • الكسره Shift + A
  • الشده ذ + Shift
  • المده Shift + Z
  • تنوين الفتحه Shift + W
  • تنوين الكسره Shift + S
  • تنوين الضمه Shift + R
  • تمديد الحرف Shift + J
وأعتقد أن هذه العلامات التشكيليه كافيه كى تعطيك المساحه لتعبر عما بداخلك بشكل صحيح من خلال كلمات مضبوطه تشكيليا .
الأحد, ديسمبر 09, 2012

أى ألوان استخدمها فى مدونتى

الألوان ما هى إلا لغه تخاطب العقل والمشاعر بدون كلام, فكل لون له دلاله ويقول شيئا محددا ويؤدى عند النظر إليه إلى الوصول إلى حاله معينه بسبب تأثيره النفسى على الإنسان.

فهناك ألوان تثير الغضب وأخرى تبعث السلام وألوان تبث البهجه فى النفوس, ولكن, هل فكرت ما هى علاقة ألوان مدونتك ولون الكتابه بما تقدمه فى مدونتك ؟ أعتقد ان 90% منا كمدونين لا نعير هذا الشىء التافه ( هو فى الحقيقه غير تافه بالمره ) أى إهتمام.
يجب عليك اولا أن تحدد ما هو الشعور الذى تود أن تقدمه للقارىء عند زيارته لمدونتك.
  • هل تريد أن تجعله غاضبا ؟
  • هل تريد أن تدخله فى حاله من الرومانسيه ؟
  • هل تريد مخاطبة عقله أم مشاعره ؟
  • هل تريد أن تجعلهخ سعيدا ؟
  • هل تريد تحفيز القارىء ؟
  • هل تريد أن تشعره بوخز الضمير ؟
كل هذا تستطيع فعله من خلال الألوان التى تختارها لمدونتك, وهذه بعض الإقتراحات عن الألوان و بعض التوجهات :

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

تصميم وصنع وابتكار أدوات و إضافات ل بلوجر ( السر )

أصبحت تنمية وتطوير وصناعة وتصميم الأدوات والإضافات رغبه وهوايه لدى الكثير من المصممين, والآن تستطيع أنت القيام بذلك أيضا بكل سهوله ويسر .... فقط مع بعض الصبر.

كل المدونين يعتمدون على المدونات والمواقع التى تقدم لهم كل الإضافات والأدوات جاهزه وتامه للإستخدام أو لإضافتها فى مدوناتهم, ولكن لماذا لا نصنع نحن أدواتنا وإضافاتنا بأيدينا وعلى حسب رغباتنا وإحتياجاتنا.
كيف يتم صنع الإضافه أو الأداه ؟
يتم صناعة الإضافه أو الأداه على مرحلتين :
  1. برمجة الأداه.
  2. تصميم الأداه.
برمجة الأداه :
أدوات بلوجر يتم برمجتها بإستخدام XHTML و JQUERY و JAVASCRIPT . وهذه اللغات البرمجيه تقوم بتحديد طريقة عمل الأداه ووظيفتها وما ستقوم بفعله. ومعظم الأدوات يتم تشكيلها بإستخدام XHTML التى تعتمد عليها بلوجر بصوره أساسيه فى برمجة مدوناتها.

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


مرحبا بك فى مدونة نصائح للمدونين
كود HTML المكون لها هو :
<p><strong><center> مرحبا بك فى مدونة نصائح للمدونين </center></strong></p>
والآن نراها بعد إدخال لغة CSS عليها :


مرحبا بك فى مدونة نصائح للمدونين
كود CSS المكون لها :
<center><span style="border-bottom: #8080ff 10px solid; border-left: #8080ff 10px solid; padding-bottom: 6px; padding-left: 6px; padding-right: 6px; border-top: #8080ff 10px solid; border-right: #8080ff 10px solid; padding-top: 6px; -moz-border-radius: 10px; -webkit-border-radius: 10px"><font color="#8080ff"><strong>مرحبا بك فى مدونة نصائح للمدونين</strong></font></span></center>
 لا تنزعج من كبر حجم الكود إطلاقا فهو شىء ممتع للغايه وسوف تستمتع به كثيرا.

والأن كيف تقم بتصميم الأداه أو الإضافه ؟
سواء كنت تريد أن تصبح مصمما للإضافات أو ستكتفى بعمل تعديلات عليها وعلى قالب مدونتك وتدويناتك لإعطائها شكلا جذابا, عليك تعلم لغة HTML و لغة CSS وهما لغتان برمجه من اسهل ما يمكن وأقولها لك ... لن تجد أى صعوبه وستحبهما كثيرا وستندمج معهما بدرجه كبيره. وعن نفسى قمت بتعلمهما بسهوله جدا وبإستمتاع من خلال البحث عن تعليمهم على الإنترنت ومن خلال ما يقدمه موقع w3schools وسوف أعطيك ثلاثة نصائح :
  1. إذهب وتعلم الفوتوشوب, قم بدراسته فيما لا يقل ولا يزيد عن شهر واحد, ولن يستغرق هو منك أكثر من ذلك وستصبح محترفا به مع الممارسه.
  2. قم بقراءة 5 دروس على الأقل فى اليوم فى لغة HTML من موقع w3schools .
  3. بعد توغلك ومعرفة أساسيات HTML قم بقراءة دروس CSS من موقع w3school بمعدل 4 دروس فى اليوم.
سوف يستغرق الأمر منك شهر فى التعلم وشهر أخر من الممارسه وتنمية المهارات ثم فى الشهر الثالث والرابع قم بتحضير نفسك كى تنال لقب مصمم.

وبعد تنمية مهاراتك فى لغتى HTML و CSS يمكنك تنمية قدراتك والعمل على ارتفاع مستواك بتعلم اللغات البرمجيه JAVASCRIPT, PHP, JQUERY .... إلخ.
وفى النهايه أنا على أتم إستعداد لأسئلتكم وإستفساراتكم وأطروحاتكم .... ضع تعليقا وشاركنا خبراتك فى هذا الموضوع.
الاثنين, يونيو 27, 2011

قائمة مواقع لتوليد أكواد سى اس اس 3

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

  1. CSS3 Generator
  2. CSS3 Please
  3. CSS3 Click Chart by Impressive Webs
  4. CSS-Tricks Button Maker
  5. Border Radius
  6. Font Squirrel @Font-Face Kit Generator
  7. Westciv
  8. CSS3 Gradient Generator
  9. Widgetpad CSS3 Generator
  10. Border Image
  11. Dry Icons Button Generator
  12. CSS Corners
  13. CSS3 Maker
  14. CSS3 Rounded Corner Generator
  15. CSS3 Menu Generator
  16. CSS3 Column Generator
  17. Quick 3-Color CSS3 Gradient Generator
السبت, أبريل 16, 2011

إختبر الخط على مدونتك عن طريق موقع إختبار الخطوط

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

موقع : font tester
الموقع به اختيارات كثيره جدا ومتعدده وتتيح لك فرصة الحصول على شكل الخطوط وطريقة الكتابه التى تريدها أن تظهر فى مدونتك.
الخميس, مارس 24, 2011