المشاركات
أضف محرك البحث الخاص بك إلى مدونة بلوجر
أضف محرك البحث الخاص بك إلى مدونة بلوجر
على الرغم بأن شريط التصفح الخاص بمدونات بلوجر والموجود في أعلى المدونات قد تم دمجه بمحرك بحث. إلا أنك قد ترغب بوضع محرك بحث مشابه في القائمة الجانبية لمدونتك أو في أعلى المقالة المنشورة كما هو موجود في موسوعة التدوين.
ويختلف محرك البحث الذي سأشرح كيفية وضعه في مدونتك عن محرك البحث المدمج في شريط تصفح البلوجر، بإن الأخير يقوم بعرض نتائج البحث على موقع بلوجر www.blogger.com وبالتالي سينقل زوار مدونتك إلى رابط جديد بعيداً عنك. بينما كود محرك البحث الذي أقدمه هنا سيعرض النتائج في مدونتك، وستكون في المساحة المخصصة لعرض الرسائل المنشورة. كما يختلف أيضاً عن أداة "مربع البحث" الموجودة ضمن مجموعة الأدوات الذكية والتي تقدمها جوجل للمدونين، وبالرغم من أن أداة "مربع البحث" تعرض النتائج في مدونتك. إلا أنها تفتقر لإمكانية تخصيص الأداة والتحكم في مظهرها --كما ستلاحظ في الشرح-- كما أنها تعرض وبحد أقصى 4 نتائج فقط. ودعونا الآن نبدأ في شرح كيفية وضع كود البحث وتخصيصه في مدونتك.
إن كود محرك البحث التالي والذي سنستخدمه هو بلغة الـ HTML ولذلك يجب وضعه في أداة HTML/Javascript وذلك بالذهاب إلى تصميم>عناصر الصفحة ومن ثم الضغط على إضافة أداةوبالطبع عليك اختيار أداة HTML/Javascript.
<p align="right">
<form id="searchthis" action="ضع رابط مدونتك هنا/search" style="display:inline;" method="get">
<strong>ضع عنوان مدونتك هنا<br/></strong>
<input id="b-query" maxlength="255" name="q" size="20" type="text"/>
<input id="b-searchbtn" value="إبحث في مدونتي" type="submit"/>
</form></p>
<form id="searchthis" action="ضع رابط مدونتك هنا/search" style="display:inline;" method="get">
<strong>ضع عنوان مدونتك هنا<br/></strong>
<input id="b-query" maxlength="255" name="q" size="20" type="text"/>
<input id="b-searchbtn" value="إبحث في مدونتي" type="submit"/>
</form></p>
وقبل أن تقوم بنسخ هذا الكود في الأداة السابقة، فيجب عليك تغيير الأسطر والتي أشرت إليها باللونين الأحمر والأزرق على النحو التالي:
يجب تعديل الكلمات المشار إليها باللون الأحمر (إجباري)، فلن يعمل الكود بالشكل الصحيح من دون تغييرها.
ضع رابط مدونتك هنا ==> عليك استبدال هذا النص برابط المدونة مبتدءاً بـ http:// ومنتهية بـ com
ضع عنوان مدونتك هنا ==> استبدل هذا النص بعنوان مدونتك ... مثال:(موسوعة التدوين) أو بأي عبارة أخرة تجدها مناسبة.
بالنسبة للكلمات المشار إليها باللون الأزرق فهي إختيارية. وتساعد على تخصيص مظهر مربع البحث في مدونتك.
إبحث في مدونتي ==> هي الجملة التي ستظهر لزوار مدونتك في مربع البحث. انظر الصورة التالية
size="20 ==> وهو طول المستطيل الذي يستخدمه الزوار لكتابة الكلمات التي يرغون بالبحث عنها. وللتوضيح أكثر فقد استخدمت في الكود السابق طول 20، وسيظهر بالشكل التالي
وفي الصورة التالية قمت بتغيير الطول إلى 30.
وبإمكانك تغيير طول مستطيل البحث إلى الحجم الذي ترغبه وذلك بتغيير الرقم 20 في الكود السابق للحجم الذي يتناسب مع قالب مدونتك. أما إذا رغبت بتغيير زر البحث "إبحث في مدونتي" إلى صورة من اختيارك. فيمكنك استخدام الكود التالي
<p align="right">
<form id="searchthis" action="ضع رابط مدونتك هنا/search" style="display:inline;" method="get">
<strong>ضع عنوان مدونتك هنا<br/></strong>
<input id="b-query" maxlength="255" name="q" size="20" type="text"/>
<input id="b-searchbtn" type="image" src=" ضع رابط الصورة هنا" align="top"/>
</form></p>
<form id="searchthis" action="ضع رابط مدونتك هنا/search" style="display:inline;" method="get">
<strong>ضع عنوان مدونتك هنا<br/></strong>
<input id="b-query" maxlength="255" name="q" size="20" type="text"/>
<input id="b-searchbtn" type="image" src=" ضع رابط الصورة هنا" align="top"/>
</form></p>
وستكون النتيجة النهائية بهذا الشكل
ولكن عليك وضع رابط الصورة في المكان المخصص لذلك في الكود السابق. لقد فضلت مشاركة هذا الكود مع قراء موسوعة التدوين نظراً لإمكانية التحكم وتخصيص هذا الكود بالشكل الذي ترغبه بينما لا تتوفر هذه الإمكانية في أداة "مربع البحث" المقدمة من جوجل.
شارك
" أضف محرك البحث الخاص بك إلى مدونة بلوجر "