22‏/01‏/2016

كيفية تثبيت محرك بحث Google المخصص لمدونات بلوجر، درسنا لهذا اليوم سيكون خفيف الظل. محرك البحث هو جزء مهم جدا في أي موقع كان ما قد ينقص في محرك البحث العادي أنه قد يظهر لك مواضيع في نطاق ما تبحث عنه فقط لا أكثر أما في محرك البحث المخصص من جوجل فكل كلمة أو عنوان له علاقة بما تبحث عنه سيظهر في نتائج البحث

أود توضيح أمر أننا في هذا الدرس لن نناقش اضافة محرك بحث بتصميم مغاير سيبقى محركك كما هو التغيير الوحيد هو نتائج البحث ولمن ليس لديه فكرة عما نود شرحه فليقم بالتجربة من خلال محرك بحث مدونة عرب ويب وسترى النتيجة... أوصي بشدة باستعمال محرك بحث مخصص لم له من فوائد ومميزات سنتطرق لها خلال الشرح، كما أن شرحنا يتضمن جميع الأساسيات لذا وجب التركيز عليه
شرح طريقة التركيب
1. يرجى زيارة موقع جوجل للبحث المخصص على : https://cse.google.com/cse
2. إضغط على Create a custom search engine لتسجيل الدخول للمحرك



3. عند الدخول إلى لوحة التحكم اضغط على New Search Engine



4. ثم املئ المطلوب كما مبين أدناه



A. ضع رابط مدونتك
B. تغيير إعدادات اللغة وفقا للغة المستخدمة في المدونة
C. إسم لمحرك البحث
D. بعد ملئ الإعدادات أعلاه اضغط على CREATE

5. اضغط على Get code



6. سجل رقم ID الخاص بك كالمحدد في الصورة لأننا سنحتاجه لاحقا




قبل أن ندخل في شكل الإضافة سأتطرق لكيفية تفعيل إعلانات أدسنس، حيث سيظهر إعلان على حسب بحث الزائر فإن كان الإعلان يحتوي على نفس محتوى متعلق بالقوالب مثلا سيظهر فوق نتائج البحث إن لم يكن لديك حساب أدسنس فيمكنك تخطي هذه المرحلة
تفعيل اعلانات ادسنس
1. من نفس لوحة التحكم الموقع انقر على محرك البحث الذي قمت بإنشائه
2. سترى خمس تبويبات : Basics (أساسيات)، Make money (كسب المال)، Admin (المشرف)، indexing (الفهرسة)، Advanced (خيارات أخرى)
قم بالضغط على تبويب Make money بعدها انقر على تفعيل ON




تخصيص محرك البحث
وصلنا لمرحلة تخصيص البحث المخصص توجد سبعة أشكال يظهر بها نتائج البحث، إما في صفحة جديدة أو منبثق أو في نفس الصفحة أو في صفحة ثابتة... وهذه الأخيرة هي ما سنعمل عليها أي مثل مدونتنا
1. ادخل إلى Look and fell
2. اختر المظهر Results only




مبروك عليك! أصبح لديك الآن معرف بحث وإعدادات ناجحة كل ما يتبقى الآن هو تثبيته على المدونة تابع التالي
تثبيت محرك البحث على المدونة
1. إتجه إلى الصفحات >> صفحة جديدة ضع في العنوان Search CSE بعدها بتبويب HTML ضع الكود التالي
<script>
  (function() {
    var cx = '007914758731451547183:qymqogegkxs';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
        '//cse.google.com/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>
<gcse:searchresults-only></gcse:searchresults-only>

<style type='text/css'>
#comments{ display: none!important; }
.post-body{background:url(https://lh6.googleusercontent.com/-UKClHRpzskg/VfOm1eLfT7I/AAAAAAAAiQw/1pwwhEsT49I/w220-h19-no/ajax-loader%2B%25281%2529.gif)50% 50% no-repeat!important;margin:0}
.gs-webResult div.gs-visibleUrl-long, .gs-promotion div.gs-visibleUrl-long {text-align: left; }
.gs-bidi-start-align.gs-snippet {     padding-right: 20px!important; font: 12px/1.8em tahoma; } .gs-title { overflow: visible!important; }
.gsc-results-wrapper-visible { font-family: 'Droid Arabic Naskh', serif; }
.gsc-webResult.gsc-result, .gsc-results .gsc-imageResult { border-color: #D6D3D3; background-color: #F7F7F7; margin: 10px 0; }
.gsc-control-cse .gsc-table-result {padding:10px;margin:0;display:block;}
.cse .gs-webResult .gs-snippet, .gs-webResult .gs-snippet, .gs-fileFormatType, .gs-imageResult .gs-snippet {color:#666;padding:10px 0;}
.cse .gs-result .gs-snippet, .gs-result .gs-snippet, .cse .gs-spelling-original, .gs-spelling-original {font-size:13px;line-height:normal;}
.gsc-control-cse .gs-spelling, .gsc-control-cse .gs-result .gs-title, .gsc-control-cse .gs-result .gs-title * {font-size:15px;text-decoration:none;font-weight:700;color:#444!important;}
.gs-result img.gs-image, .gs-result img.gs-promotion-image {vertical-align:middle;border:none;margin-bottom:0;}
.gs-webResult div.gs-visibleUrl-long, .gs-promotion div.gs-visibleUrl-long {display:block;font-size:10px;}
.post-body td:hover{background:#fff;}
.cse .gsc-results .gsc-cursor-page.gsc-cursor-current-page, .gsc-results .gsc-cursor-page.gsc-cursor-current-page {color:#fff;background-color:#333;text-shadow:none;padding:3px 7px;}
.gsc-results .gsc-cursor-box .gsc-cursor-page {cursor:pointer;background:#f6f6f6;color:#666;text-decoration:none;padding:3px 7px; margin-bottom: -20px; position: relative; top: 15px;}
.gsc-selected-option-container {font-size:inherit;max-width:100%;width:90px!important;}
</style>
2. ضع بدل 007914758731451547183:qymqogegkxs المعرف الذي سجلته سابقا
3. قم بنشر الصفحة
4. اتجه إلى قالب >> تحرير واذهب مباشرة إلى محرك بحثك
5. أضف الكود التالي داخل محرك بحثك مع تغيير  007914758731451547183:qymqogegkxs
<input type='hidden' name='cx' value='partner-pub-007914758731451547183:qymqogegkxs' />
<input type='hidden' name='cof' value='FORID:10' />
<input type='hidden' name='ie' value='ISO-8859-1' />
* هذا مثال يوضح الطريقة على كود محرك بحثنا قبل اضافة الكود :
<form action='/search' class='searchform' method='get'>
<input class='searchfield' id='q' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;' type='text' value='ابحث هنا...'>
<input id='searchsubmit' type='submit' value=''><span class='fa fa-glass'/></input>
</input>
</form>
* بعد إضافة الكود اصبح هكذا :
<form action='Ali2sm/p/search-cse.html' class='searchform'>
<input name='cx' type='hidden' value='partner-pub-007914758731451547183:qymqogegkxs'/>
<input name='cof' type='hidden' value='FORID:10'/>
<input name='ie' type='hidden' value='ISO-8859-1'/>
<input class='searchfield' id='q' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;' type='text' value='ابحث هنا...'>
<input id='searchsubmit' type='submit' value=''><span class='fa fa-glass'/></input>
</input>
</form>
6. أنظر للكود أدناه ستجده في محرك البحث الخاص بك
<form action='/search' class='searchform' method='get'>
استبدل الرمز /search بهذا /p/search-cse.html وهو رابط الصفحة التي أنشأتها
7. قم بحفظ العمل واذهب للتجربة

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

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

أود توضيح أمر أننا في هذا الدرس لن نناقش اضافة محرك بحث بتصميم مغاير سيبقى محركك كما هو التغيير الوحيد هو نتائج البحث ولمن ليس لديه فكرة عما نود شرحه فليقم بالتجربة من خلال محرك بحث مدونة عرب ويب وسترى النتيجة... أوصي بشدة باستعمال محرك بحث مخصص لم له من فوائد ومميزات سنتطرق لها خلال الشرح، كما أن شرحنا يتضمن جميع الأساسيات لذا وجب التركيز عليه
شرح طريقة التركيب
1. يرجى زيارة موقع جوجل للبحث المخصص على : https://cse.google.com/cse
2. إضغط على Create a custom search engine لتسجيل الدخول للمحرك



3. عند الدخول إلى لوحة التحكم اضغط على New Search Engine



4. ثم املئ المطلوب كما مبين أدناه



A. ضع رابط مدونتك
B. تغيير إعدادات اللغة وفقا للغة المستخدمة في المدونة
C. إسم لمحرك البحث
D. بعد ملئ الإعدادات أعلاه اضغط على CREATE

5. اضغط على Get code



6. سجل رقم ID الخاص بك كالمحدد في الصورة لأننا سنحتاجه لاحقا




قبل أن ندخل في شكل الإضافة سأتطرق لكيفية تفعيل إعلانات أدسنس، حيث سيظهر إعلان على حسب بحث الزائر فإن كان الإعلان يحتوي على نفس محتوى متعلق بالقوالب مثلا سيظهر فوق نتائج البحث إن لم يكن لديك حساب أدسنس فيمكنك تخطي هذه المرحلة
تفعيل اعلانات ادسنس
1. من نفس لوحة التحكم الموقع انقر على محرك البحث الذي قمت بإنشائه
2. سترى خمس تبويبات : Basics (أساسيات)، Make money (كسب المال)، Admin (المشرف)، indexing (الفهرسة)، Advanced (خيارات أخرى)
قم بالضغط على تبويب Make money بعدها انقر على تفعيل ON




تخصيص محرك البحث
وصلنا لمرحلة تخصيص البحث المخصص توجد سبعة أشكال يظهر بها نتائج البحث، إما في صفحة جديدة أو منبثق أو في نفس الصفحة أو في صفحة ثابتة... وهذه الأخيرة هي ما سنعمل عليها أي مثل مدونتنا
1. ادخل إلى Look and fell
2. اختر المظهر Results only




مبروك عليك! أصبح لديك الآن معرف بحث وإعدادات ناجحة كل ما يتبقى الآن هو تثبيته على المدونة تابع التالي
تثبيت محرك البحث على المدونة
1. إتجه إلى الصفحات >> صفحة جديدة ضع في العنوان Search CSE بعدها بتبويب HTML ضع الكود التالي
<script>
  (function() {
    var cx = '007914758731451547183:qymqogegkxs';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
        '//cse.google.com/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>
<gcse:searchresults-only></gcse:searchresults-only>

<style type='text/css'>
#comments{ display: none!important; }
.post-body{background:url(https://lh6.googleusercontent.com/-UKClHRpzskg/VfOm1eLfT7I/AAAAAAAAiQw/1pwwhEsT49I/w220-h19-no/ajax-loader%2B%25281%2529.gif)50% 50% no-repeat!important;margin:0}
.gs-webResult div.gs-visibleUrl-long, .gs-promotion div.gs-visibleUrl-long {text-align: left; }
.gs-bidi-start-align.gs-snippet {     padding-right: 20px!important; font: 12px/1.8em tahoma; } .gs-title { overflow: visible!important; }
.gsc-results-wrapper-visible { font-family: 'Droid Arabic Naskh', serif; }
.gsc-webResult.gsc-result, .gsc-results .gsc-imageResult { border-color: #D6D3D3; background-color: #F7F7F7; margin: 10px 0; }
.gsc-control-cse .gsc-table-result {padding:10px;margin:0;display:block;}
.cse .gs-webResult .gs-snippet, .gs-webResult .gs-snippet, .gs-fileFormatType, .gs-imageResult .gs-snippet {color:#666;padding:10px 0;}
.cse .gs-result .gs-snippet, .gs-result .gs-snippet, .cse .gs-spelling-original, .gs-spelling-original {font-size:13px;line-height:normal;}
.gsc-control-cse .gs-spelling, .gsc-control-cse .gs-result .gs-title, .gsc-control-cse .gs-result .gs-title * {font-size:15px;text-decoration:none;font-weight:700;color:#444!important;}
.gs-result img.gs-image, .gs-result img.gs-promotion-image {vertical-align:middle;border:none;margin-bottom:0;}
.gs-webResult div.gs-visibleUrl-long, .gs-promotion div.gs-visibleUrl-long {display:block;font-size:10px;}
.post-body td:hover{background:#fff;}
.cse .gsc-results .gsc-cursor-page.gsc-cursor-current-page, .gsc-results .gsc-cursor-page.gsc-cursor-current-page {color:#fff;background-color:#333;text-shadow:none;padding:3px 7px;}
.gsc-results .gsc-cursor-box .gsc-cursor-page {cursor:pointer;background:#f6f6f6;color:#666;text-decoration:none;padding:3px 7px; margin-bottom: -20px; position: relative; top: 15px;}
.gsc-selected-option-container {font-size:inherit;max-width:100%;width:90px!important;}
</style>
2. ضع بدل 007914758731451547183:qymqogegkxs المعرف الذي سجلته سابقا
3. قم بنشر الصفحة
4. اتجه إلى قالب >> تحرير واذهب مباشرة إلى محرك بحثك
5. أضف الكود التالي داخل محرك بحثك مع تغيير  007914758731451547183:qymqogegkxs
<input type='hidden' name='cx' value='partner-pub-007914758731451547183:qymqogegkxs' />
<input type='hidden' name='cof' value='FORID:10' />
<input type='hidden' name='ie' value='ISO-8859-1' />
* هذا مثال يوضح الطريقة على كود محرك بحثنا قبل اضافة الكود :
<form action='/search' class='searchform' method='get'>
<input class='searchfield' id='q' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;' type='text' value='ابحث هنا...'>
<input id='searchsubmit' type='submit' value=''><span class='fa fa-glass'/></input>
</input>
</form>
* بعد إضافة الكود اصبح هكذا :
<form action='Ali2sm/p/search-cse.html' class='searchform'>
<input name='cx' type='hidden' value='partner-pub-007914758731451547183:qymqogegkxs'/>
<input name='cof' type='hidden' value='FORID:10'/>
<input name='ie' type='hidden' value='ISO-8859-1'/>
<input class='searchfield' id='q' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;' type='text' value='ابحث هنا...'>
<input id='searchsubmit' type='submit' value=''><span class='fa fa-glass'/></input>
</input>
</form>
6. أنظر للكود أدناه ستجده في محرك البحث الخاص بك
<form action='/search' class='searchform' method='get'>
استبدل الرمز /search بهذا /p/search-cse.html وهو رابط الصفحة التي أنشأتها
7. قم بحفظ العمل واذهب للتجربة

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

آمل أن الشرح افادكم ونجحت معكم كل المراحل لأنني قمت باختصارها وتبسيطها قدر المستطاع، نلقاكم في تدوينة اخرى إن شاء الله .
26 Blogger تعليقات
Disqus
26 التعليقات
أزال أحد مشرفي المدونة هذا التعليق. - حذف
المشرف
avatar

شكرا لك

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

المشرف
avatar

شكرا اخي وبنتظار الجديد دائما

المشرف
avatar

على الرحب والسعة إخواني الأعزاء
@ TH9MOUSSA :
قالب مدونتك جميل اتمنى لك التوفير، وأعتذر عن حذف التعليق لأنه يعتبر رابط اشهاري

@ Mohamed Talidi : سأنشر فقط أكواد التحميل أخي ربما في الأسبوع المقبل

@ مروان فوان : بزيارتك لنا فالجديد قادم دائما بإذن الله، شكرا لك

المشرف
avatar

khay hussam salamo alikom akhay ntmna tkon mzyan bghit nsowlk choft atnzl wahd l9alab jdid we bgjit n3raf wach mazal 3ad atnzlo wla fe had lyomayn hit 3jbni bzaaf we bghit ndiro fe modawana dyali

المشرف
avatar

3aliom salam, fhad l2yam lmo9bila radi ikon

المشرف
avatar

sf chokraaan khay hussam anstnaah insha allah

المشرف
avatar

اخي احتاج مساعدتك من فضلك اريد تغير لون القالب الخاص بي

المشرف
avatar

لو سمحت رابط الصفحة بعد ما احط الاكواد بيجي كدا p/function-var-cx-008770796172133354393mw.html

المشرف
avatar

شكرا على هذاالعمل المتقن
أود اضافة ملاحضظة مهمة
بخصوص نوع محرك البحث (أو الشكل )
الصحيح هو : هذا الشكل
https://cse.google.com/cse/images/look/google_hosted.png

المشرف
avatar

رائع بجد .. تسلم يارجولة

المشرف
avatar

مشكلتى بعد التركيب تكرار p/p/

حضرتك انا عملت مثل الشرح بالتفاصيل لكن اولا الرابط طلع مختلف
كمثال طلع كدا
p/function-var-cx-00791787874551547183qy.html
وليس كما فى الشرح وهو كدا
/p/search-cse.html
فقمت بتغير الرابط فى تعديل القالب ليناسب تغير الرابط طلع كل شى طلع مضبوط مع ان رابط الصفحة طويل

المشكلة حاليا اللى بتوجهنى ان اما ابحث فى داخل مربع بحث المدونة اول مرة يطلع الرابط تمام ولكن عند تكرار البحث يتكرر هذا الكود فى الرابط
/p/
فيظهر الرابط هكذا
p/p/function-var-cx-00791787874551547183qy.html

فيكون النتيجة ان رابط الصفحة يكون غلط فيخرج برة صفحة البحث ويجيب رسالة خطاء للزائر

وكل اما اجر ابحث تانى فى صندوق البحث الخاص بالموقع يعطنى p/p/p ويستمر بالخطاء

مع العلم اما ببحث فى مربع بحث جوجل داخل موقع يكون سليم

المشرف
avatar

حلك بسيط اخي أولا قم بحفظ الكود الذي وضعته في الصفحة ثم احذفها بعد ذلك انشئ صفحة جديدة وضع العنوان أولا : search cse
وقم بنشر الصفحة ثم حررها مجددا وضع الكود وانشرها وهكذا كن متيقنا بأن الرابط سيطلع صحيح (ملاحظة يمكنك تغيير العنوان بعدها للعربية)

المشرف
avatar

الشكل يمكنك اختيار ما يناسبك أنا فقط طبقت على شكل واحد مشكور على الملاحظة

المشرف
avatar

اخى الرابط الحمد الله بقا تمام لكن مشكلتى وهى عند البحث فى بحث المدونة اكثر من مرة فى مربع البحث يذيد كل مرة p/ يعنى تكون كدا /p/p وكل مرة ابحث عن شى وانا معملتش فرش للصفحة يذيد واحد p/p/p ودا فى رابط الصفحة والنتيجة بيجيب صفحة خطاء لان الرابط غلط هل يوجد حل اسف اخى اعتذر تعبتك معى

المشرف
avatar

اترك رابط موقعك لو سمحت

المشرف
avatar

اتفضل اخى رابط موقعى
http://www.staralltime.com

المشرف
avatar

هل وضعت الرابط هكذا : http://www.staralltime.com/p/search-cse.html في كود المحرك الذي بداخل القالب؟ إن كان كذلك فاحذفه اترك فقط :
/p/search-cse.html

المشرف
avatar

لا اخى انا عملة مثل كدا كما فى شرحك
/p/search-cse.html

المشرف
avatar

شكرا اخى تم الحل جربت اضيف دى كدا
p/search-cse.html/
فنجحت عملت دى / قبل حرف p
شكرا اخى على تجاوبك معى وتسلم كتير والله انت انسان رائع وخدوم

المشرف
avatar

العفو اخي الكريم سعدت بأن المشكلة حُلت

المشرف
avatar

أخي كل شيء تمام لكن مشكل واحد وهو سرعة ضهور النتائج تأخ وقت لكي يتم تحميلها وهذا ربما ليس جيد فما الحل لمجرد الظغط على البحت تظهر النتائج وشكرا لكم هذه هي مدونتي http://www.salmimath.com/

المشرف
avatar

اختر شكل آخر في ظهور النتائج في الشرح بالخطوة (تخصيص محرك البحث) جرب مثلا : full width

المشرف
avatar

أخي لم يتم تغيير أي شي كيف أجعله مدمج كالدي على مدونة المحترف

المشرف
avatar

التجربة مو شغالة

المشرف
avatar

شكرا مليون ، اشتغلت تسلم الآيادي

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لإضافة كود حوله أولاً بمحول الأكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة