این صفحه نحوه سفارشی کردن ظاهر و احساس کادر جستجو و نتایج جستجو را مورد بحث قرار می دهد. اگر می خواهید طراحی موتور جستجوی خود را با استفاده از فایل زمینه پیاده سازی کنید، به "طراحی ظاهر و احساس با XML صفحه" مراجعه کنید.
- بررسی اجمالی
- طراحی اجزای فردی رابط کاربری جستجو
- میزبانی نتایج با استفاده از عنصر جستجو
- تنظیم طرح عنصر جستجو
- طراحی جعبه جستجو
- طراحی نتایج
- پیاده سازی طراحی در وب سایت شما
بررسی اجمالی
می توانید هم کادر جستجو و هم نتایج جستجوی موتور جستجوی قابل برنامه ریزی خود را در کنترل پنل یا فایل زمینه XML تغییر دهید. اگر تعداد انگشت شماری موتور جستجو دارید، مدیریت و سفارشی کردن آنها با کنترل پنل نسبتاً ساده است. فقط کافیست به صفحه Look and feel بروید، یک سبک را انتخاب کنید، اجزای آن را طراحی کنید، روی Save کلیک کنید و آماده هستید. این صفحه به شما می گوید که چگونه همه این کارها را انجام دهید. با این حال، اگر شما در حال ایجاد و مدیریت تعداد زیادی موتور جستجو هستید، حتی همین روش ساده - زمانی که در چندین موتور جستجو تکرار می شود - خسته کننده می شود. در چنین مواردی، کار با XML بهتر خواهد بود. اگر تصمیم به استفاده از XML دارید، ابتدا این صفحه را بخوانید تا ایده ای در مورد نحوه عملکرد کلی داشته باشید. پس از آن، صفحه طراحی ظاهر و احساس با XML را بخوانید تا با عناصر و ویژگی های XML آشنا شوید.
اگر مطمئن نیستید که فقط باید از کنترل پنل استفاده کنید یا از فرمت XML استفاده کنید، به صفحه مبانی مراجعه کنید، که مزایا و چالش های هر قالب را مورد بحث قرار می دهد.
توجه: قبل از شروع طراحی ظاهر و احساس موتور جستجوی سفارشی خود، دستورالعمل های پیاده سازی موتور جستجوی قابل برنامه ریزی را بخوانید. این یک سند کوتاه است که به شما می گوید چگونه باید با نام تجاری و اسناد گوگل رفتار کنید.
میزبانی نتایج با استفاده از عنصر جستجو
عنصر جستجو یک شی است که می توانید آن را در صفحه وب خود جاسازی کنید، که امکان سفارشی سازی گسترده را فراهم می کند. می تواند کادر جستجو و نتایج جستجو را با هم در همان صفحه وب که خواننده مشاهده می کند یا در صفحات وب مختلف نشان دهد.
توجه: عنصر جستجو، وقتی با یک طرح‌بندی فشرده جفت می‌شود، در دستگاه‌های تلفن همراه به خوبی کار می‌کند.
همچنین می‌توانید از API کنترل عنصر جستجوی برنامه‌پذیر برای سفارشی‌سازی بیشتر رابط کاربری جستجو استفاده کنید. بسیاری از سفارشی سازی ها از طریق ویژگی های HTML پشتیبانی می شوند. به عنوان مثال، می توانید از بین شش طرح بندی برای صفحه نتایج خود انتخاب کنید، یا می توانید تعداد نتایج جستجو را برای بازگشت تنظیم کنید.
موتور جستجوی قابل برنامه ریزی دیگر از گزینه میزبانی iframe پشتیبانی نمی کند. ما طرح‌بندی «دو صفحه» یا «فقط نتایج» را در عنصر جستجو به‌عنوان گزینه‌های جدید توصیه می‌کنیم. برای اطلاعات بیشتر پست وبلاگ ما را بررسی کنید.
طراحی اجزای فردی رابط کاربری جستجو
اجزای قابل تنظیم
اجزایی که می‌توانید سفارشی کنید بستگی به طرح عنصر انتخابی موتور جستجوی شما دارد. به عنوان مثال، کنترل پنل به شما امکان می دهد یک لوگو فقط برای موتورهای جستجویی که توسط Google میزبانی می شوند اضافه کنید. شما نمی توانید با استفاده از گزینه های میزبانی دیگر، یک لوگو به موتورهای جستجو اضافه کنید.
با استفاده از کنترل پنل می توانید اجزای زیر را تعریف کنید:
- طرح عنصر جستجو
- کادر جستجو
- نتایج جستجو
- زبانه های پالایش
- تبلیغات
- لوگو (فقط میزبان گوگل)
تنظیم طرح عنصر جستجو
شما این گزینه را دارید که چگونه رابط کاربری جستجوی خود را در صفحه وب سفارشی کنید. می توانید کادر جستجو و بخش نتایج را در یک ستون قرار دهید یا آنها را در ستون های جداگانه با کادر جستجو در یک ستون و بخش نتایج در ستون دیگر یا حتی در صفحه دیگر نمایش دهید.
گزینه های طرح بندی شما عبارتند از (برای دیدن دمو روی پیوندها کلیک کنید):
| گزینه | شرح |
|---|---|
| OverLay | نمایش نتایج جستجو در یک پوشش. |
| دو صفحه ساده جعبه های جستجوی متعدد / بخش نتایج | کادر جستجو و بخش نتایج جستجو در دو صفحه وب متفاوت قرار می گیرند. توجه : بخش نتایج جستجو شامل یک کادر جستجو نیز می باشد. کاربران می‌توانند درخواست‌های خود را مستقیماً در صفحه نتایج جستجو ارسال کنند. |
| تمام عرض | کادر جستجو و بخش نتایج جستجو، تمام عرض صفحه یا ستونی را که عنصر جستجو را در آن درج کرده اید، اشغال می کند. |
| دو ستونی | کادر جستجو و بخش نتایج جستجو در ستون ها یا بخش های مختلف صفحه وب شما قرار دارند. برای بستن بخش نتایج جستجو، کاربر بر روی نماد X در کنار کادر جستجو کلیک می کند. |
| فشرده - جمع و جور | مانند گزینه تمام عرض، تمام عرض صفحه یا ستون را اشغال می کند، اما بخش نتایج نتایج کمتری را نشان می دهد، بنابراین وقتی در صفحه وب باز می شود فضای عمودی کمتری را اشغال می کند. نکته: این گزینه برای گوشی های هوشمند و دستگاه های تلفن همراه بهینه شده است. |
| فقط نتایج جستجو از طریق URL جستجو از طریق جعبه جستجو | نتایج جستجو در یکی از صفحات وب شما قرار می گیرد و صفحه نتایج جستجو شامل کادر جستجو نمی شود. از کادر جستجوی خود برای ارسال عبارت جستجو استفاده کنید. توجه : موتور جستجوی قابل برنامه ریزی که تبلیغات را نشان نمی دهد، گزینه ای برای غیرفعال کردن نام تجاری ندارد. |
| میزبانی گوگل پنجره فعلی پنجره جدید | کادر جستجو در یکی از صفحات وب شما قرار می گیرد. نتایج جستجو در یک صفحه وب میزبانی شده توسط Google نمایش داده می شود که می تواند در همان پنجره یا در یک پنجره جدید باز شود. |
طراحی جعبه جستجو
می‌توانید کادر جستجو را در هر جایی از بدنه HTML صفحه وب خود وارد کنید، اگرچه - طبق قرارداد - کادرهای جستجو در بالای (یا نزدیک به بالای) صفحات وب قرار می‌گیرند، مانند مثال زیر:
شکل 1: صفحه وب با کادر جستجو در بالا.
فعال کردن تکمیل خودکار
تکمیل خودکار گزینه های پرس و جو را به کاربران شما ارائه می دهد، زیرا آنها عبارت های جستجوی خود را در کادر جستجوی شما وارد می کنند. این شبیه به پرس و جوهای اختیاری است که در جستجوی Google مشاهده می کنید.
شکل 2: با تایپ تنها چند کاراکتر در کادر جستجو، یک لیست کشویی ظاهر می شود که گزینه هایی را برای عبارت های جستجوی مختلف ارائه می دهد.
موتور جستجوی قابل برنامه ریزی تکمیل خودکار را به طور خاص برای موتور جستجوی شما تنظیم می کند. از الگوریتم متفاوتی استفاده می کند که از چندین منبع، از جمله پرس و جوها به موتور جستجوی شما، و همچنین کلمات کلیدی و عبارات استخراج شده از محتوای وب سایت هایی که موتور جستجوی شما پوشش می دهد، استفاده می کند.
از آنجایی که پرس و جوهای تکمیل شده خودکار – تا حدی – بر اساس محتوای خاص صفحات وب تحت پوشش موتور جستجوی شما هستند، موتور جستجوی قابل برنامه ریزی تکمیل خودکار را برای موتورهای جستجویی که کل وب را جستجو می کنند ایجاد نمی کند. به عبارت دیگر، تنها موتورهای جستجویی که سایت‌هایی را جستجو می‌کنند - مجموعه‌ای از وب‌سایت‌های از پیش تعیین‌شده - می‌توانند پرس‌وجوهای تکمیل‌شده خودکار داشته باشند. می توانید پوشش موتور جستجوی خود را در بخش Sites to search صفحه نمای کلی تنظیم کنید.
ویژگی تکمیل خودکار در بخش تکمیل خودکار صفحه ویژگی های جستجو قرار دارد.
برای فعال کردن تکمیل خودکار، موارد زیر را انجام دهید:
- به بخش تکمیل خودکار صفحه ویژگی های جستجو بروید.
- فعال کردن کنترل تکمیل خودکار را روشن کنید.
توجه: از آنجایی که پرس و جوهای تکمیل شده خودکار برای هر موتور جستجو ایجاد می شود، چند ساعت طول می کشد تا تکمیل خودکار در موتور جستجوی شما ظاهر شود.
- اگر برای اولین بار تکمیل خودکار را در یک موتور جستجوی موجود فعال می کنید، باید قطعه کد کادر جستجو را که در صفحه وب خود درج کرده بودید حذف کنید. آن را با مورد جدیدی که در برگه دریافت کد ایجاد شده است جایگزین کنید. برای دستورالعمل های دقیق تر، به بخش پیاده سازی طراحی در وب سایت خود مراجعه کنید.
طراحی نتایج
می توانید اجزای زیر را در صفحه نتایج تغییر دهید:
- نتایج فردی
- نوع فونت
- رنگ های متن
- زبانه های پالایش
- تبلیغات
- لوگو (فقط با میزبانی گوگل)
نتایج فردی
اگر می‌خواهید به‌صورت بصری نتایج فردی را مشخص کنید یا نتایجی را که توسط کاربران انتخاب می‌شوند برجسته کنید، می‌توانید مرزها و پس‌زمینه را برای نتایج فردی مشخص کنید.
شکل 3: نتایج با نتایج فردی مشخص شده و نتیجه فردی که روی ماوس برجسته شده است.
زبانه های پالایش
اگر برچسب‌های اصلاحی را در موتور جستجوی خود ایجاد کرده‌اید، برچسب‌ها به صورت برگه‌ها در عنصر جستجو ظاهر می‌شوند. می توانید از کنترل پنل برای تغییر رنگ برگه های اصلاح استفاده کنید.
تبلیغات
اگر تبلیغاتی را در موتور جستجوی خود ایجاد کرده اید، می توانید ظاهر و احساس آنها را تغییر دهید. تبلیغات نوع خاصی از نتایج جستجو هستند که شما ایجاد می کنید.
لوگو (فقط میزبانی شده توسط Google)
اگر به Google اجازه می‌دهید صفحه نتایج شما را میزبانی کند، می‌توانید یک لوگو یا تصویر کوچک را درست در کنار کادر جستجو در صفحه نتایج جستجو قرار دهید. تصویر باید یک فایل jpg، .png یا .gif باشد که در یک وب‌سایت میزبانی می‌شود (خود شما یا از وب‌سایتی که محدودیت‌های حق نسخه‌برداری ندارد). شما می توانید یک URL را با تصویر مرتبط کنید و آن را به یک تصویر قابل کلیک تبدیل کنید.
در زیر نمونه ای از صفحه نتایج با لوگو آمده است.
شکل 4: کادر جستجو با یک تصویر
پیاده سازی طراحی در وب سایت شما
بعد از اینکه ظاهر و ظاهر موتور جستجوی خود را طراحی کردید، می توانید با انجام کارهای زیر آن را در صفحه وب خود پیاده سازی کنید:
- در بخش هایی که در صفحه ظاهر و احساس تغییر داده اید، روی ذخیره کلیک کنید.
- در قسمت Layout صفحه Look and feel روی دریافت کد کلیک کنید.
- قطعه کد ایجاد شده در پاپ آپ Code را کپی کنید.
اگر طرح دو ستونی را انتخاب کرده اید، دو قطعه کد را کپی کنید: یکی برای کادر جستجو و دیگری برای نتایج.
اگر طرح بندی دو صفحه ای را انتخاب کرده اید، URL صفحه وب را تایپ کنید که نتایج را برای موتور جستجوی شما نشان می دهد. نام پارامتر پرس و جو تعبیه شده در url را تایپ کنید که توسط صفحه نتایج جستجو تجزیه می شود. در نهایت، دو قطعه کد را کپی کنید.
قطعه کد برای طرح‌بندی فقط نتایج برای مواردی است که نتایج جستجو در یک صفحه جدید نشان داده می‌شوند. نام پارامتر پرس و جو تعبیه شده در url را تایپ کنید که توسط صفحه نتایج جستجو تجزیه می شود. در نهایت، قطعه کد نتایج جستجو را کپی کنید. - کد را در هر صفحه ای که می خواهید جعبه موتور جستجوی قابل برنامه ریزی را درج کنید. می‌توانید کد را در هر جایی از تگ
<body></body>صفحه وب خود جای‌گذاری کنید.توجه: برای بیشترین سازگاری بین مرورگرها، توصیه می شود که صفحات HTML شما از یک doctype پشتیبانی شده مانند
<!DOCTYPE html>استفاده کنند.اگر از جلوه های شناور برای عنصر جستجوی خود استفاده می کنید، صفحه HTML شما باید از یک doctype پشتیبانی شده مانند
<!DOCTYPE html>استفاده کند.
اگر طرح دو ستونی را انتخاب کرده اید، کد کادر جستجو را در یک ستون و کد نتایج را در ستون دیگری وارد کنید.
اگر طرح‌بندی دو صفحه‌ای را انتخاب کرده‌اید، کد کادر جستجو را در صفحه وب که می‌خواهید کادر جستجو نشان داده شود، و کد نتایج را در صفحه وب که می‌خواهید نتایج جستجو در آن نمایش داده شود، وارد کنید.
اگر طرح‌بندی فقط نتایج را انتخاب کرده‌اید، قطعه کد را در صفحه وب جایی که می‌خواهید نتایج جستجو نشان داده شود، وارد کنید.