الدرس الرابع للاشهار على منتدى عشاق الحب

زي ما اتفقنا احبائي في الدرس اللي فات اهمية التولبار ده .. وازاي انه ممكن يفرق في ترتيب موقعك بشكل ملحوظ عشان كده احنا هنخلي اعضاء موقعك يحملوا التولبار ده وبأسم موقعك ( الشعار )



- ازاي ازاي ؟؟



انت علي طول مستعجل كده



الاول الشكل النهائي للتولبار علي الاكسبلور هيبقي كده ( من غير شعار موقعك )








اما علي الفايرفوكس فاتولبار بيبقي تحت ومبيظهرش فيه الصورة اللي مكتوب عليها اسم موقعك او منتداك ( شعار الموقع )










- اشمعني يعني ؟؟



والله نفسي اعرف اهو بقي تفرقة عنصرية

ودي صورة توضح مكان اللوجو بتاع موقعك



هذه الصورة تم تصغيرها تلقائيا . إضغط هنا لمشاهدة الصورة بحجمها الطبيعى 705x89.




نبدا علي بركه الله ..




اولا يجب ان يكون لدينا حساب في شركة امازون الشهيرة وهي طريقة بسيطة ان شاء الله



- وايه اللي ودانا امازون دلوقتي ؟؟



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



اولا ادخل علي هذا الرابط :

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]


وبعد ما دخلنا نختار

No i am a new customer


وتكتب ايميلك في الخانة اللي قصاده











هتلاقي صفحة تسجيل .. سهل جدا ..




















وهوصل للصفحة اللي احنا فيها دلوقتي .. مكتوب فيها اليوزر نيم بتاعك كده








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

ويعدين نضغط علي

specify payment method later

وللتأكيد هذا هو اليوزر نيم تاني










بعد ما خدنا اليوزر بتاعنا كوبي .. نقفل بقي الصفحة مشتكرين



- خلص كده التسجيل ؟؟



اه خلص بتاع امازون بس ... نبتدي بقي نعمل التولبار ..



ندخل هلي الرابط ده

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]



اولا صورة الشعار اللي هتعملها هتبقي صورة لا يتعدي حجمها 3 كيلو و طولها 21 وعرضها 70 .. يعني حاجة زغننه جدا .. فيعني لو مش عايز تعمل الشعار ده مفيش مشكلة دوس علي الرابط ده وهيوديك علي الصفحة اللي بعديها :







اما لو عايز تعمل الشعار عادي .. هتلاقي قدامك مستطيلين كده ادام كلمة

standard gif


و

transparent gif


شوف الخلفية اللي عاجباك فيهم ( بالنسبالي اختار الاولي ) وتعالا عندها وبعدين اضغط لمين كليك ودوس save picture as

واعملها save عادي عندك علي الجهاز



ودول الخلفيتين اللي هنعمل عليهم الشعار ..يعني الراجل بيسهل عليك عشان متتعبش في المقاسات







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



- هعدل عليها ازاي دي ؟



عادي باي برنامج للصور .. الافضل طبعا الفوتوشوب



- معنديش انا الفيتشويب ده اعمل ايه ؟؟



اولا اسمه فوتوشوب .. يعني لو متعرفوش يبقي انت ولا مؤاخذة متعرفش حاجة اسمها جرافيكس



- خلص يا عم ..!



ثانيا عادي اعملها بالـ paint زي مانا عملتها بس مش هتطلع طبعا بحلاوة الفوتوشوب ...
بصوا دي الصورة اللي انا عملتها بال paint .. بسم الله ما شاء الله يعني روعة روعة ( اللهم ما حسد )






خبرة انا في التصميم
( وممكن كمان تعلمها صورة متحركة بالايمج ريدي مثلا بس لازم مساحتها متزدتش عن الـ 3 كليو )



- طيب دلوقتي هنتصرف ازاي في الصورة دي ؟؟



الاول نغيير اسم الملف لـ toolbar.gif
وبعد كده عادي خالص هنرفعها بالاف تي بي


- تاني ؟؟



وتالت كمان .. لازم بقي تحبوا

طبعا هنرفعها عادي زي ما شرحت في الدروس اللي فاتت.. هنفتح الاف تي بي ونكتب اسم الموقع واليوزر والباص وبعدين نرفع الصورة لاي فولدر تحبه .. انا عن نفسي رفعته في فولدر الصور Images واقدر اشوف الصورة من الرابط ده

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]



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



نرجع بقي للصفحة اللي سايبنها علي النار .. قصدي علي المتصفح والمرادي هنضغط continue









هتظهرلك دلوقتي صفحة فيها مربع فيه كلام ولت وعجن كتير







- اه ايه العجينة دي ؟؟ انا مش فاهم حاجة !!



لا عجينة ولا حاجة .. سهلة جدا ركز بس في الكود اللي مكتوب .. مطلوب منك تعدل علي 4 حاجات



- ايه هم ؟؟

- مش واضحة اوي الفكرة .. انت لغبطني !!!



عادي الصورة اللي جاية فيها وصف للكام سطر اللي فاتوا دول









ياريت تكون الفكرة وصلت وده تطبيقي انا بعد ما عدلت علي الكود









تمام كده ؟؟



-اه تمام وعملت الكود مظبوط ان شاء الله



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








اعمله save وبعدين عدل علي اسمه وامتدادة
بدل new text Document.txt
هنخليها toolbar.xml

وهيبقي في النهاية شكلة عامل كده







ملاحظة : اللي ما يظهر عنده امتداد الملف .. يفتح My Computer .. ثم من شريط الادوات فوق يختار tools > Folder option
ثم بعد كده









وللمرة الاخيرة ان شاء لله في الدرس ده هنرفع ملف بالاف تي بي ... وهيكون التولبار اللي عاملناه .. اظن اتشرح قبل كده .. سهلة ومفهاش اي مشاكلة .. وهنرفعها في المجلد الرئيسي بيحث نقدر نفتحه من الرابط ده

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
يعني هنرفعه جنب ملف Index.html وكده

ولو فتحناه من المتصفح الفروض تطلع الصفحة كده




هذه الصورة تم تصغيرها تلقائيا . إضغط هنا لمشاهدة الصورة بحجمها الطبيعى 722x374.




... بعد ما رفعناه نرجع تاني لصفحة المتصفح اللي ركناها .. وهنلاقي مستطيل عريض شوية تحت المربع اللي فيه الكود اللي عدلنا عليه والمستطيل بأسم import your configuration









وده هنكتب فيه رابط التولبار وفي حالتنا لو انت رافع زيي او زي ما اتفقنا اننا هنرفعه في الرئيسية يبقي هنكتب الرابط كده

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

وبعدين ندوس علي continue



واخيرا والحمد لله وصلنا للصفحة تقريبا النهائية هتلاقي فيها اسم موقعك و الرابط و اليوزر نيم بتاع امازون والصورة اللي عملتها .. وهتلاقي كمان صورة مصغرة للتولبار بعد ما اتحط فيه الصورة اللي صممتها .. وفي اخر الصفحة هتلاقي رابط جنب ( your download link ) وهو ده الرابط اللي هتديه لاعضاءك يحملو منه التولبار








طبعا ناخد الرابط ده عندنا في ملف تكست عشان نستخدمة بعد كده

ولو فتحنا الرابط من اكسبلور هنلاقي حاططلنا شكل التولبار بالتصميم و زرار install now عشان نحمل منه التولبار





هذه الصورة تم تصغيرها تلقائيا . إضغط هنا لمشاهدة الصورة بحجمها الطبيعى 767x447.





ولو فتحناه من الفايرفوكس .. هنلاقي برضه حاططلنا شكل للتولبار بس من غير التصميم .. وشريط اليكسا في الفايرفوكس بيظهر تحت مش فوق زي اكسبلور .. ونضغط علي Get Sparky عشان نحمله





هذه الصورة تم تصغيرها تلقائيا . إضغط هنا لمشاهدة الصورة بحجمها الطبيعى 740x425.



اما عن طريقة بقي عرض التولبار للزوار واعضاء موقعك فده شيء سهل جدا .. الاول تعمل بانر ويستحسن يكون متحرك للتولبار ده .. وده لازم يبقي بالفوتوشوب والايمج ريدي عشان يطلع حلو واكتب في البانر مميزاته او ممكن تكتب ( اذا كنت تريد ان تدعم موقع xxx فحمل التولبار فهو يمنع الصفحات الدعائية ويمنع السبام و و و ) المميزات بتاعته يعني بطريقة متحركة جميلة

وذا كنت تستخدم موقع عادي .. فبالفرونت بيج تقدر تعمل حيز لصورة البانر وتحط رابط تحميل التولبار ( اللي حطناه في ملف تكست ) ولو كانت واجهه يبقي بالبرنامج اللي انت صممت بيه الواجهه تقدر تعمل مكان للبانر ( فوتوشوب مثلا )

اما لو منتدي فتقدر تركب الهاك اللي في المرفقات ..الهاك لاخونا ( سعيد العطوي ) الصراحة هاك روعة للاعلانات .. تقدر تعمل اعلان كبير وتحط فيه صورة البانر ورابط تحميل التولبار
وده موضوعه فيه شرح الهاك وكيفيه التركيب

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]



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

أمير الحب تحياتي لكم