منتدى الدعم العربي لمنتديات أحلى منتدى
مرحبا بك في منتدى دعم منتديات AhlaMontada

لتتمكن من الإستمتاع بكافة ما يوفره لك هذا المنتدى من خصائص, يجب عليك أن تسجل الدخول الى حسابك في المنتدى. إن لم يكن لديك حساب بعد, نتشرف بدعوتك لإنشائه.


انشاء منتدى مجاني شبيه بهذا المنتدى

شرح طريقة عمل محرك البحث Google فى منتداك

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل

معلومة شرح طريقة عمل محرك البحث Google فى منتداك

مُساهمة من طرف zhegazy في السبت 21 ديسمبر 2013 - 20:26


شرح طريقة عمل محرك البحث Google فى منتداك

 بسم الله الرحمان الر
السلام عليكم ورحمه الله وبركاته

الزعيم كتب:بعون الله نأتيكم اليوم بشرح دقيق لكيفية إضافة محرك
بحث خارق و ذو مميزات جد متطورة تضيفونه أينما أردتم في منتداكم من عناصر و
صفحات html خاصة ...الخ.

الطريقة سهلة جداً و بالإضافة الى اعطائك محرك بحث خاص بمنتداك فهي تساهم في تسجيل منتداك في محرك البحث العملاق Google بهذا تكون قد اصطدت عصفورين بحجر واحد...


اولاً عليك انشاء حساب فى Google عن طريق هذا الرابط

ثانياً قم بالضغط على هذا الرابط

ثم تابع الشرح

 تقوم بالضغط على "إنشاء محرك بحث مخصص"


هيظهر لك بعد ذلك الأتى طبق ما يوجد فى الصورة
وبعد الانتهاء اضغط على
"CREATE"


هتظهر لك بعد ذلك الأتى
قم بالضغط على
"Get code"


ثم هيظهر لك بعد ذلك الصفحة الخاصة بالكود تقوم بالضغط عليه ونسخة وضعه فى منتداك





واذا اردت ان تقوم ببعض الاضافات فى صندوق البحث الخاص بـ Google نفسه
يمكنك عن طريق الضغط على
"Look and feel" كما موضح فى الصورة

تقوم بالضغط على
"Themes" منها يمكنك الاختيار شكل صندوق البحث كما موضح بالصورة



ثم تقوم بالضغط على "Customize"


-
Font:- لاختيار نوع الخط
-
Border color:- خاصة بلون ايطار الصندوق
-
Background color:- خاصة بلون الصندوق نفسه


ثم قم بالضغط على
"Search box"


- Border color:- خاص بلون الصندوق التى يتم كتابة فيه الكلمة المراد البحث عنها

ثم قم بالضغط على
"Search button"


- Border color:- خاص بلون ايطار الزر الخاص بالبحث
-
Background color:- خاص بلون خلفية الزر الخاص بالبحث

ثم قم بالضغط على
"Result general"


- Border color normal:- لتحديد لون الايطار المحيط بنتائج البحث

ثم قم بالضغط على
"Result title"


-
Unvisited color:- خاص بلون الورابط التى لم يتم الضغط عليها
-
Visited color:- خاص بلون الروابط التى تم الضغط عليها
-
Hover color:- خاص بلون الروابط عند مرور بالفأرة عليها

ثم قم بالضغط على
"Result url"


- Url color:- خاص بلون الرابط الذى يوجد فى نتائج البحث
-
Show full URL:- لاظهار الرابط بالكامل فى نتائج البحث
-
Show domain name only:- لاخفاء جزء من الرابط مثل "Forum"
الخاصة بالصفحة الرئيسية لاى منتدى تابع لاحلى منتدى

ثم قم بالضغط على
"Result snippet"


- Snippet color:- خاص بلون وصف الكلام الذى يوجد فى نتائج البحث

ثم قم بالضغط على
"Save & Get code"




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




أنتهى الشرح .. بالتوفيق .. zhegazy



تم تجديد الصور من قبل JAR7 




عدل سابقا من قبل النجم الذهبى في الإثنين 18 سبتمبر 2017 - 13:15 عدل 7 مرات (السبب : تنسيق الشرح)
avatar
zhegazy
 
 

ذكر
عدد المساهمات : 40452
معدل النشاط : 38008
السُمعة : 45

الرجوع الى أعلى الصفحة اذهب الى الأسفل

معلومة رد: شرح طريقة عمل محرك البحث Google فى منتداك

مُساهمة من طرف zhegazy في السبت 21 ديسمبر 2013 - 20:26


شرح طريقة عمل محرك البحث Google فى منتداك

الزعيم كتب:السلام عليكم,


اماكن وضع كود محرك البحث Google

أولا عليك التوجه من لوحة إدارة منتداك الى خانة " عناصر إضافية " >> " إعدادات صفحات البوابة " :





ثم نذهب الى الخيار " مكونات " :





ثم نضغط على الزر " إنشاء عنصر شخصي " :





ثم نملأ البيانات كما يلي :





بعد ذلك تعود إلى اعدادات صفحات بوابتك و تدخل على ركن العناصر الشخصية المستقلة فتجد عنصرك الجديد :





مبروك عليك محرك البحث الخارق.


2. تريد ان تصنع محرك البحث الجديد داخل عنصر شخصي على الرئيسية و يظهر على كل الصفحات:


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


ما عليك إلا التوجه من لوحة إدارة منتداك الى " عناصر اضافية " >> " إدارة العناصر المستقلة على المنتدى " :





ثم إضغط على الزر " إنشاء عنصر شخصي " :




ثم نملأ البيانات كما يلي :





ثم عليك ان تختار مكان ظهور المحرك :






ما عليك الآن إلا إظهار العناصر المستقلة على الصفحة الرئيسية للمنتدى :






مبروك عليك محرك بحثك الخاص الخارق


3. تريد ان تصنع محرك البحث الجديد داخل صفحات ال html الخاصة بمنتداك:

تقوم بأتباع الشرح فى الاعلى


وهنا شرح مفصل لصفحات HTML
-صفحات HTML


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


و السلام


عدل سابقا من قبل Mohamed Nsr في الأربعاء 29 يوليو 2015 - 5:32 عدل 1 مرات (السبب : تنسيق الشرح)
avatar
zhegazy
 
 

ذكر
عدد المساهمات : 40452
معدل النشاط : 38008
السُمعة : 45

الرجوع الى أعلى الصفحة اذهب الى الأسفل

معلومة [جديد وحصرى] شرح إضافة شريط البحث جوجل لمنتداك لسهولة البحث ولأرشفة منتداك

مُساهمة من طرف Mahmoud Eslam في الجمعة 22 مايو 2015 - 17:17


[جديد وحصرى] شرح إضافة شريط البحث جوجل لمنتداك لسهولة البحث ولأرشفة منتداك

بسم الله الرحمان الر ,
السسسلامم عليكمم ورحمةة الله وبركاته هـ ..
> أهلاً وسسهلاً بكمم أعضاء الدعم <

[شرح] طريقةة إضافةة شريط البحث Google إلى منتداك ، فهو يساعد على ارشفته وتقويةة مواضيع منتداك فى جوجل لسهولةة الوصول الى المنتدى ومواضيعةة واحتلالها المرتبةة الاولى فى جوجل & وهى الطريقةة الحاسمةة لكل الطرق الأخرى والتى تمم تشغيلها وتجريبها على اكثر من منتدى , 

[ ملحوظةة ] - يجب ان يكون لديك حسساب فى جوجل ..

- عليك بالدخول الى الرابط التالى :- https://accounts.google.com/ServiceLogin ( لتسجيل دخولك فى جوجل ) ..
> بعد إتمام عمليةة تسسجيل الدخول عليك (بالضغط هنا ) وذالك لإضافةة محرك البحث المخصص google الى منتداك وتابع معى الششرح بالصور :-
(1) نضغط على Add او إضافةة ..
[center]
http://i19.servimg.com/u/f19/13/91/22/87/111_bm10.jpg
,
(2) نملأ البيانات [ نكتب رابط المنتدى - اللغةة للمنتدى - اسمم المنتدى او احد اسماء مشرفى المواقع لجوجل ] ثمم نحفظ ..
http://i19.servimg.com/u/f19/13/91/22/87/222_bm10.jpg
,

صورةة بعد ملأ البيانات :

http://i19.servimg.com/u/f19/13/91/22/87/333_bm10.jpg
,

(3) جلب الكود الذى سنستخدمةة فى استكمال هذه العمليةة عن طريق الضغط على تعديل او Edit او Editar ..


http://www.servimg.com/u/f19/13/91/22/87/444_bm10.jpg
,
ثممم استكمل الشرح بالصور التاليةة

http://i19.servimg.com/u/f19/13/91/22/87/555_bm10.jpg
,
ستظهر لك نافذةة الكود ننسخةة :-

http://i19.servimg.com/u/f19/13/91/22/87/666_bm10.jpg
,

(4) نذهب إلى لوحةة الإدارةة - مظهر المنتدى - الصفحةة الرئيسيةة - تشكيلات عامةة - ثمم نضع الكود على هيئةة html ..
[center]
http://i19.servimg.com/u/f19/13/91/22/87/777_bm10.jpg
,

http://i19.servimg.com/u/f19/13/91/22/87/888_bm10.jpg
,
[right](5) نذهب إلى لوحةة الإدارة - عناصر إضافيةة - أكواد هتمل وجافا سكربت - نختر أكواد جافا سكربت - ثمم نضيف كود جديد ..
[center][ ملحوظةة ] نضع الكود على جميع الصفحات #

http://i19.servimg.com/u/f19/13/91/22/87/999_bm10.jpg
,
$ اليكمم الكود :-

الكود:
$(function () {
  //Renseigner ici entre ' ' le code obtenu sur Google
  var cx = '004869397998480616231:wa9kmobovvq';
 
        if($("div#search-box").length){
      //phpBB3 avec barre de recherche
      $("div#search-box").html("<div id='my_gs'><gcse:search></gcse:search></div>");
  }else{
      if($("div#page-body").length){
        //phpBB2, phpBB3 sans barre de recherche & punBB
        $("<div id='my_gs'><gcse:search></gcse:search></div>").insertBefore("div#page-body");
      }else{
        //Invision
        $("<div id='my_gs'><gcse:search></gcse:search></div>").insertAfter("div#submenu");
      }
  }
 
  var gcse = document.createElement('script');
  gcse.type = 'text/javascript';
  gcse.async = true;
  gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
      '//www.google.com/cse/cse.js?cx=' + cx;
  var s = document.getElementsByTagName('script')[0];
  s.parentNode.insertBefore(gcse, s);
});


(6) نذهب إلى لوحةة الإدارةة - مظهر المنتدى - الصور والالوان - الوان -  ورقةة تصميم css ونضف الكود التالى ..


( ملحوظةة ) تأكد من تشغيل نظام تحسين مردودديةة css ..



http://i19.servimg.com/u/f19/13/91/22/87/10_bmp10.jpg
,
واليكمم الأكواد :-
[ تخصيص شريط البحث ]

الكود:
.my_gs{
      /* Propriedades do CSS (use o !important) */
}
 
div#my_gs{
        width: 300px; /* Largura, você pode aumentar de 300 para mais. */
}
[ تخصيص مربع البحث ( المدخلات ) ]

الكود:
input.gsc-input{
      /* Propriedade CSS (Use o !important) */
}
[ تخصيص زر البحث ]

الكود:
input.gsc-search-button{
      /* Propriedade CSS (Use o !important) */
}
[ الكود كامل ]

الكود:
   .my_gs{
          /* Propriedades do CSS (use o !important) */
    }
    
    div#my_gs{
            width: 300px; /* Largura, você pode aumentar de 300 para mais. */
    }

    input.gsc-input{
          /* Propriedade CSS (Use o !important) */
    }
    input.gsc-search-button{
          /* Propriedade CSS (Use o !important) */
    }

c]النتيجةة ] مجربةة على النسخةة الثالثةة - تعمل على جميع النسسخ ..,


http://i19.servimg.com/u/f19/13/91/22/87/1111_b10.jpg
,




تمم الشرح بواسطةة The Globetrotter ..
# 0]هاامم ] يمنع منعاً باتاً النقل بدون ذكر الحقوق ..
[ تحياتى لكمم The Globetrotter ] المتطوع المساعد ،
[/center]
[/right]
[/center]
[/center]


عدل سابقا من قبل Mohamed Nsr في الأربعاء 29 يوليو 2015 - 5:31 عدل 2 مرات (السبب : تنسيق الشرح)
avatar
Mahmoud Eslam
 
 

ذكر
عدد المساهمات : 2910
معدل النشاط : 5478
السُمعة : 53

http://help-pub.3oloum.org/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة

- مواضيع مماثلة

 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى