طراحی سایت ساناتک
0
اکانت توییتر در سایت شما

تا اینجا به فیسبوک و خدمات آن پرداختیم—قطعاً در صورت آشنایی بیشتر و گذر از کاربردهای مبتدی می توانید کارهای بیشتر و بهتری با فیسبوک انجام دهید—اما حالا نوبت به شبکه اجتماعی پر طرفدار و دوست داشتنی توییتر است.

همان طور که پیش تر اشاره کردیم توییتر نسبت به فیسبوک بسیار ساده تر است و تنها از بروزرسانی های status تشکیل شده است که به آن ها tweet می گویند، همین! مانند فیسبوک در اینجا هم گذاشتن tweet ها در وب سایت اصلی ساده است. همچنین اضافه کردن کلید Follow را در سایت مان خواهیم آموخت. لازم به ذکر است که بخش مربوط به موبایل توییتر یک قابلیت متفاوت و مختص به همین سرویس است.

افزودن بروزرسانِ توییتر به سایت

فرض ما بر این است که شما اکانت توییتر دارید. اگر در این سایت عضو نشده اید به twitter.com بروید و Sign Up کنید.

صفحه عضویت توییتر

عکس 8.21: صفحه عضویت توییتر

خوب، فرض بر این است که Username خود را انتخاب کردید، چند خطی About You نوشته و تصویری مناسب برای اکانت توییتر خود برگزیده اید، حالا به بخش های جالب تر می رویم.

به صفحه Resources توییتر، نشان داده شده در عکس 8.22 بروید.

 

صفحه Resources توییتر

 

عکس 8.22: صفحه Resources توییتر

منتخبی از feature های کاربردی با استفاده آسان را در این بخش می بینید، Widget ها را امتحان کنید، مخصوصاً آن هایی که برای وب سایت اصلی طراحی شده اند(Widgets for > My Website).

انتخاب یک Widget

عکس 8.23: گزینه های متعددی در انتخاب یک Widget برای سایت وجود دارند.

همان طور که در عکس 8.24 می بینید Profile Widget را انتخاب کنید.

 Pofile Widget در توییتر

عکس 8.24: صفحه مربوط به Pofile Widget

حالا می توانید Profile Widget را شخصی سازی کنید. با توجه به اینکه قرار است از آن در سایت اصلی استفاده کنیم بهتر است به ظاهر و رنگ ها تغییراتی اعمال نماییم، برای این کار کلید Appearance، نشان داده شده در عکس 8.25 را بزنید.

 تغییرات در Profile Widget

عکس 8.25: تغییرات دلخواه خود را به Profile Widget وارد کنید.

در نهایت اندازه را در صفحه Dimensions تعیین کنید(به عرض 200 پیکسل)؛ حالا می توانید کد را با فشردن Finish & Grab Code دریافت نمایید. کد ظاهر شده را کپی کرده و فایل index.html را باز کنید و کد جدید را زیر کد iframe مربوط به فیسبوک و پیش از تگ بسته پیست نمایید.

قرار نبود حرفی از Script به میان آورده شود!

برای استفاده از script ها هنوز مانده است، پس با دیدن این اسم برای بار اول نگران نشوید. نکته کلیدی در اینجا این است که لازم نیست نحوه کار و کاربردهای دقیق یک Script را بدانیم—همین که بدانید کار می کند کافی است! در حقیقاً تنها چیزی که برای حال حاضر شما نیاز است دانستن نحوه کپی و پیست کردن آن است. دانش JavaScript—چیزی که در اینجا با آن روبه‌رو هستیم—خود یک شاخه متفاوت است که به طور گذرا در فصل چهاردهم به آن نگاهی خواهیم کرد و مثال های جالبی از کاربردها و نحوه کار آن برای شما خواهیم آورد.

با یک ذخیره سازی و بارگذاری مجدد مرورگر نتیجه کار را خواهید دید. حدس می زنیم که Twitter Update نیز دقیقاً بعد از جعبه Like فیسبوک ظاهر شده باشد.

سایت مجهز شده به فیسبوک و توییتر

عکس 8.26: حالا سایت ما به فیسبوک و توییتر نیز مجهز شده است.

به نظر می رسد بخش راست صفحه اندکی شلوغ پلوغ و به هم ریخته شده است. باور کنید به زودی به حل این مشکل خواهیم پرداخت. فعلاً باقی کار را به پیش می بریم.


تعداد بازدید: 109
نویسنده: هانیه سهرابی
مطالب دیگر آموزش طراحی سایت
باگ‌ های شناخته شده مرورگرهاراستی‌ آزمایی کدهای CSS و HTML بعد از طراحی سایترفع خطاهای احتمالی هنگام طراحی سایتدقیق‌ تر شدن در استفاده از jQueryنمایش کپشن‌ های تصاویر درون گالری سایت
 
@

با عضویت در خبرنامه در جریان آخرین اخبار و مطالب سایت قرار بگیرید