بيت - برمجة
إشارة مرجعية عبر المتصفح للصفحة. أضف إلى المفضلة لجميع المتصفحات أضف جافا سكريبت إلى المفضلة

بدءًا من اليوم، سأخبرك عن وظيفة مفيدة واحدة على الموقع - هذا رابط أو زر "إضافة إلى الإشارات المرجعية (المفضلة)". تتيح هذه الميزة للمستخدمين وضع إشارة مرجعية على الصفحة التي يحبونها على موقعك في متصفحهم حتى يتمكنوا من الوصول إليها بسرعة وسهولة عند الحاجة.

سيقول الكثير منكم: "لماذا تكرر وظيفة المتصفح، لأن هذا الزر موجود في شريط العناوين؟"

نعم يوجد، لكنه موجود، أولاً، ليس ملحوظًا جدًا، وثانيًا، بعض المستخدمين لا يعرفون عنه على الإطلاق.

لتحسين واجهة المستخدم (واجهة المستخدم)، من الأفضل تكرار هذه الوظيفة ووضع الرابط/الزر "إضافة إلى الإشارات المرجعية (المفضلة)" في مكان بارز. على سبيل المثال، إذا كان لديك متجر عبر الإنترنت، فمن الأفضل إدراجه على بطاقة المنتج، وإذا كان لديك مدونة، فأسفل المقالة أو فوقها. لا يزال الموقع بحاجة إلى الاختبار. ويمكن أيضًا وضعها في رأس الموقع في جميع الصفحات.

هناك العديد من الطرق المختلفة لتنفيذ هذه الوظيفة على الإنترنت، ولكن معظمها لا يعمل في جميع المتصفحات، وأحيانًا لا يعمل في المتصفحات القديمة، وأحيانًا في المتصفحات الجديدة، وأحيانًا في IE، وأحيانًا في مكان آخر.

لذلك كان علي أن أختار الأفضل بينهم وأضيف إليه القليل. واليوم سأشارككم هذه الطريقة وسأقدم لكم إرشادات خطوة بخطوة حول كيفية تثبيت رابط/زر "إضافة إلى الإشارات المرجعية (المفضلة)" على موقع الويب الخاص بك.

لإنشاء زر "إضافة إلى الإشارات المرجعية" لموقع ما، نحتاج إلى اتباع 3 خطوات بسيطة:

إنشاء ملف JS

إذا كان لديك جافا سكريبت على موقعك - ​​وهو ملف يتصل بجميع صفحات الموقع، فاستخدمه وانتقل إلى الخطوة التالية. إذا لم يكن لديك مثل هذا الملف، فأنت بحاجة إلى إنشائه. للقيام بذلك، سنقوم بإنشاء مجلد يسمى "js" في المجلد الجذر للموقع، وسيكون هناك ملف فيه بالفعل ونطلق عليه اسم "functions.js".

< !DOCTYPE html>رأس المتجر > محتوى الصفحة

نسخ وحفظ الكود

يوجد أدناه رمز JavaScript الذي تحتاج إلى لصقه في الملف الذي حددته/أنشأته وحفظه:

الوظيفة addFavorite(a) ( var title = document.title; var url = document.location; حاول ( // Internet Explorer window.external.AddFavorite(url, title); ) Catch (e) ( حاول ( // Mozilla window. Sidebar.addPanel(title, url, ""); Catch (e) ( // Opera if (typeof(opera)=="object" || window.sidebar) ( a.rel="sidebar"; a.title = title; a.url=url; return true else ( // تنبيه غير معروف("اضغط على Ctrl-D لوضع إشارة مرجعية على الصفحة"); ) ) return false;

إضافة رابط/زر إلى الموقع

الآن كل ما علينا فعله هو تحديد مكان على الموقع ولصق كود HTML التالي هناك:

إضافة هذه الصفحة إلى المفضلة لديك!

هذا كل شئ! يمكنك رؤية (وتجربة) كيفية عمل كل ذلك أدناه، وكذلك في الشريط الجانبي لهذا الموقع.

ملاحظة. وأود أن أضيف: هذه الطريقة تعمل على المتصفحات التالية:

  • الأوبرا
  • موزيلا فايرفوكس
  • Google Chrome / Safari - سيتم عرض الرسالة "اضغط على Ctrl-D لوضع إشارة مرجعية على هذه الصفحة" في هذه المتصفحات، تم تعطيل هذه الوظيفة لأسباب أمنية.

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

ويرجع ذلك جزئيًا إلى حقيقة أن مدونات تحسين محركات البحث (SEO) الرائدة (حيث يتم توجيه جميع أعين مشرفي المواقع المبتدئين وغير المبتدئين) تستهدف جمهورهم العمري، والذي يستخدم في الغالب قارئات RSS أو حتى Twitter. في الوقت الحاضر، من النادر جدًا العثور على زر "إضافة صفحة إلى الإشارات المرجعية". ولكن عبثا! تشير بعض المواضيع إلى وجود مجموعة أكبر سناً تواجه صعوبة كبيرة في استيعاب "الابتكارات" مثل تويتر، وحتى قارئات RSS، التي بدأ استخدامها منذ فترة طويلة.

بالنسبة لهؤلاء الأشخاص، تكون الإشارة المرجعية للمفضلة أكثر وضوحًا، حيث يتم فرز جميع المواقع في متصفحهم المفضل.

بالطبع، لا أحد يمنع محبي الإشارات المرجعية من الضغط على مجموعة المفاتيح الثمينة Ctrl + D وبالتالي إضافة إشارة مرجعية عزيزة، ولكن بالنسبة للعديد من الأشخاص، فإن المجموعات الرهيبة على لوحة المفاتيح، حتى لو كانت تتكون من مفتاحين فقط، تشبه البخور شيطان .

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

لذلك، تتمثل المهمة في وضع زر عبر المتصفحات "إضافة إلى الإشارات المرجعية" أو "إضافة إلى المفضلة" - كما تفضل. الشيء الرئيسي، أكرر، هو التوافق عبر المتصفحات، أي. وظيفة هذا الزر في المتصفحات الرائدة - Google Chrome، Mozilla Firefox، Opera، Internet Explorer.

هل تقول مهمة سهلة؟! لا على الإطلاق - كل المشاكل تكمن في عالمية الكود، في توافقه عبر المتصفحات. رمز واحد مناسب فقط لبرنامج Internet Explorer ولا يعمل مع المتصفحات الأخرى.

إليك المثال الأكثر شيوعًا على الإنترنت.

اضافة الى المفضلة

أو هنا نسخة من برنامج جافا سكريبت بسيط ولكن عديم الفائدة:

إضافة هذه الصفحة إلى المفضلة لديك

هذه الرموز تعمل فقط مع متصفح Internet Explorer! لكي يكون البرنامج النصي للإشارات المرجعية متوافقًا حقًا مع جميع المتصفحات، يجب أن يكون لديه فحص مضمن في متصفح العميل، اعتمادًا على المتصفح، واستخدام رمز الإشارة المرجعية المناسب.

يعمل هذا البرنامج النصي مع متصفحي Firefox وOpera، لكن Google Chrome لا يفهمه ويطالبك بالضغط على Ctrl + D، وبالتالي وضع إشارة مرجعية على الصفحة.

ولكن هذا هو أفضل ما تمكنت من البحث عنه على الإنترنت (لا يتم احتساب تركيب الهوائيات!).

البرنامج النصي عبر المتصفح:

< script type="text/javascript">
الدالة getBrowserInfo() (
فار t,v = غير محدد;

إذا (window.chrome) t = "Chrome"؛
وإلا إذا (window.opera) t = "Opera"؛
وإلا إذا (document.all) (
ر = "آي";
var nv = navigator.appVersion;
var s = nv.indexOf("MSIE")+5;
v = nv.substring(s,s+1);
}
وإلا إذا (navigator.appName) t = "Netscape"؛

العودة (النوع:t،الإصدار:v)؛
}

إشارة مرجعية للوظيفة (أ)(
فار url = window.document.location;
عنوان فار = window.document.title;
var b = getBrowserInfo();

if (b.type == "IE" && 8 > = b.version && b.version > = 4) window.external.AddFavorite(url,title);
وإلا إذا (b.type == "Opera") (
a.href = url;
a.rel = "الشريط الجانبي";
a.title = url+"،+title;
عودة صحيحة؛
}
else if (b.type == "Netscape") window.sidebar.addPanel(title,url,"");
else تنبيه("اضغط على CTRL-D لوضع إشارة مرجعية على هذه الصفحة.");
عودة كاذبة؛
}
< /script>


اضافة الى المفضلة< /a >

لاستخدام هذا البرنامج النصي على موقعك، تحتاج إلى إضافة الجزء العلوي، الموجود بين العلامات< script type="text/javascript" >وفي رأس موضوعك.

إذا كان لديك حل - كيفية إضافة وظيفة الإشارة المرجعية لمتصفح Chrome إلى البرنامج النصي، فيرجى الرد في التعليقات!


الموضوع يحظى بشعبية كبيرة. تحظى خدمات إنشاء الإشارات المرجعية عبر الإنترنت بشعبية كبيرة، ولكن دعونا نحاول حل المشكلة. لن نستخدم خدمة طرف ثالث، ولكننا سنحل هذه المشكلة على الموقع. ونتيجة لذلك، سيتمكن الزائر، من خلال النقر على الرابط، من وضع إشارة مرجعية على الموقع (على غرار Ctrl+D، وما إلى ذلك).

كيفية إضافة موقع إلى الإشارات المرجعية (المفضلة)؟ باستخدام JavaScript قم بإنشاء ملف يسمى bookmark.js. ونقوم بلصق الكود أدناه فيه.

كود جافا سكريبت (ملف bookmark.js)

وظيفة AddToBookmark(أ)
{
عنوان فار = window.document.title; // تذكر عنوان الصفحة/علامة التبويب النشطة
فار url = window.document.location; // تذكر العنوان أيضًا

إذا (window.sidebar) (// مثل هذا الكائن موجود فقط في Gecko
window.sidebar.addPanel(title, url, ""); // استخدم طريقته لإضافة إشارة مرجعية
}
آخر إذا (typeof(opera)=="object") (// هل هناك كائن أوبرا؟
a.rel="sidebar"; // أضف إشارة مرجعية، راجع استدعاء الوظيفة أدناه
a.title=title;
a.url=url;
عودة صحيحة؛
}
else if(document.all) ( // حسنًا، هذا يعني أن هذا هو Internet Explorer
window.external.AddFavorite(url, title); // استخدم الطريقة المناسبة
}
آخر(
تنبيه("لإضافة صفحة إلى المفضلة، اضغط على Ctrl+D"); // لجميع المتصفحات الأخرى، بما في ذلك. كروم
}

عودة كاذبة؛
}
حسنًا، لكي يعمل البرنامج النصي، ما عليك سوى توصيل ملف bookmark.js وإدراج رابط باستخدام js، والذي، عند النقر عليه، سيؤدي إلى عمل البرنامج النصي.

كود HTML



مثال لكيفية عمل إضافة علامات التبويب


إضافة رابط إلى المفضلة



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

كيفية إضافة موقع إلى المفضلة؟ الخيار الثاني في السابق، كانت الوظيفة تعمل فقط في Internet Explorer، ولكن بعد التغييرات في HTML 5، أصبحت تعمل في Opera وMozilla، ولكن ليس في جميع إصدارات IE وChrome.

قبل إدراج علامة رأس الإغلاق


وظيفة addYoursite() (
إذا (document.all) window.external.addFavorite("http:/yoursite.ru"، "Site yoursite.ru")؛
}

وفقًا لذلك فقط نقوم بتغيير yoursite.ru إلى عنوان موقعك.

اضافة الى المفضلة

وبناء على ذلك، نقوم أيضًا بتغيير yoursite.ru إلى عنوان موقعك.

مستعد. دعونا تحقق.

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

علم النفس يعمل هنا. الحقيقة هي أنه عندما يرى المستخدم عرضًا للإضافة إلى المفضلة على موقع ويب، فإنه يتساءل عما إذا كان يحتاج إليه. وإذا قرر أن الموقع مفيد حقا، فسوف يضيفه إلى قائمة الإشارات المرجعية الخاصة به. وإذا لم يكن هناك عرض، فلن يفكر المستخدم في هذه المشكلة. ولهذا لا بد من التقديم: من يقرع يفتح له الباب.

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

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

ليست هناك حاجة لجعل الزر كبيرًا جدًا أو صغيرًا جدًا. تذكر أن الزر يجب أن يتناسب مع التصميم العام للموقع، وألا يكون متطفلاً أو غير واضح للغاية.

كود زر "إضافة الموقع إلى المفضلة".

تدعم معظم المتصفحات الحديثة، مع ظهور معيار HTML5، السمة rel = "sidebar".

إضافة موقع إلى المفضلة لديك - وظيفة "Nubex" addSite() ( if (document.all) window.external.addFavorite("http://site", "Site builder "Nubex""); )

لا تنسى وضع إشارة مرجعية على موقعنا! (بالنسبة لمتصفح Google Chrome، اضغط على Ctrl+D)

إضافة الموقع إلى المفضلة

لكن تذكر أنه في متصفح Google Chrome لا يمكن وضع إشارة مرجعية على موقع ما باستخدام زر موجود على الموقع. هناك مجموعة مفاتيح خاصة لهذا: Ctrl+D، لذا تأكد من إبلاغ المستخدم بهذا.

يمكنك تتبع عدد المستخدمين الذين قاموا بوضع إشارة مرجعية على موقعك، على سبيل المثال، باستخدام خدمة Yandex.Metrica ("الحضور" - "التحويلات").

مرحبًا. دعونا نتحدث عن كيفية إنشاء رابط أو زر لإضافته إلى المفضلة (الإشارات المرجعية) لجميع المتصفحات: Chrome وFirefox وOpera وInternet Explorer وSafari - عبر المتصفحات، بحيث يتمكن المستخدم من حفظه عندما ينقر عليه المستقبل وتذكر صفحتك. بطبيعة الحال، تأكد من أن المحتوى مثير للاهتمام، وإلا فلن يقوم أحد بوضع إشارة مرجعية عليه :)
إذا هيا بنا.

ما يجب إضافته إلى HTML أضف إلى الإشارات المرجعية

أدخل الرمز في أي مكان تحتاجه. يمكن تغيير أو حذف جميع الإعدادات باستثناء تلك المذكورة أدناه.

  • معرف = "المفضل"
    سيتم هنا كتابة تعليمات Chrome وOpera وجميع المتصفحات المستندة إلى محرك Webkit
  • ريل = "الشريط الجانبي"
    السمة مطلوبة، مطلوبة لمتصفح فايرفوكس، لذلك ستحدد أنه يجب إرسال الصفحة عبر الرابط إلى المفضلة
  • href = ""
    ومن المستحسن أيضًا تركها دون تغيير. سيأخذ Firefox رابط الإشارة المرجعية من هذا العنوان

    إذا كان الأمر متروكًا لي، فسوف أقوم باستبدال a بـspan ، لكن هذا الخيار لن يعمل مع Firefox

  • عند النقر = "addFav ()"
    سيتم تعريف برنامج جافا سكريبت هنا. المزيد عنه
أشياء يجب إضافتها إلى JavaScript // وظيفة لوضع إشارة مرجعية على المفضلة | https://site?p=710 وظيفة addFav() ( var title = document.title, url = document.location, UA = navigator.userAgent.toLowerCase(), isFF = UA.indexOf("firefox")!= - 1, isMac = UA.indexOf("mac")!= -1, isWebkit = UA.indexOf("webkit")!= -1, isIE = UA.indexOf(".net") != -1(isIE ||.isFF) && window.external) ( // IE، Firefox window.external.AddFavorite(url, title); return false; ) if (isMac || isWebkit) ( // Webkit (Chrome, Opera)، مستند Mac. getElementById("AddFavViaSheens").innerHTML = "اضغط على "" + (isMac ? "Command/Cmd" : "Ctrl") + " + D" لوضع إشارة مرجعية على هذه الصفحة";

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

كيفية تجنب إظهار رابط المفضلة على الأجهزة اللوحية ومتصفحات الهاتف المحمول

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

// وظيفة تحديد "قابلية التنقل" للمتصفح وظيفة MobileDetect() ( var UA = navigator.userAgent.toLowerCase(); return (/android|webos|iris|bolt|mobile|iphone|ipad|ipod|iemobile|blackberry |windows phone |opera mobi|opera mini/i .test(UA)) ? true: false ) // إذا لم يكن المتصفح محمولاً، فاعرض الرابط if (!MobileDetect())( document.getElementById("MyID" .innerHTML = "هنا كود رابط HTML (انظر أعلاه)" ؛

دعونا نقسمها قليلاً

  • var UA = navigator.userAgent.toLowerCase(); — يكتب رؤوس المتصفح إلى متغير، ويحولها إلى أحرف صغيرة. بناءً على محتواه، سنحدد "قابلية التنقل" للمتصفح.
  • return (/Regular Express/.test(UA) ? true: false) - filter. يسجل التعبير العادي الأجزاء التي يمكن العثور عليها في رؤوس متصفحات الهاتف المحمول. يمكنك إضافة القيم الخاصة بك عن طريق فصلها | .

    عامل التصفية حساس لحالة الأحرف. لذلك، إذا قمت بإدخال القيم الخاصة بك في الفلتر، فتأكد من كتابتها بأحرف صغيرة (أحرف صغيرة).

  • document.getElementById("MyID").innerHTML = "هذا هو كود HTML للارتباط"; - يبحث عن علامة تحتوي على id="MyID" في الكود ويكتب الرابط الخاص بنا بدلاً من ذلك. لكي يعمل، يجب عليك أولاً الكتابة في المكان الذي تريد عرض الرابط فيه
مثال على البرنامج النصي والصفحة النهائية

اسمحوا لي أن ألخص الشكل الذي قد يبدو عليه كود html في النهاية:

// وظيفة تحديد "قابلية التنقل" للمتصفح وظيفة MobileDetect() ( var UA = navigator.userAgent.toLowerCase(); return (/android|webos|iris|bolt|mobile|iphone|ipad|ipod|iemobile|blackberry |windows phone |opera mobi|opera mini/i .test(UA)) ? true: false) // إذا لم يكن المتصفح محمولاً، فاعرض الرابط if (!MobileDetect()) ( document.getElementById("AddFavViaSheens" ).innerHTML = "إضافة إلى الإشارات المرجعية" ) // وظيفة إضافة المفضلة إلى الإشارات المرجعية | https://site?p=710 document.getElementById("AddFavViaSheens").onclick = function () ( var title = document.title, url = document.location, UA = navigator.userAgent.toLowerCase(), isFF = UA .indexOf("firefox")!= -1, isMac = UA.indexOf("mac")!= -1, isWebkit = UA.indexOf("webkit")!= -1, isIE = UA.indexOf(". net") != -1; if ((isIE || isFF) && window.external) ( // IE، Firefox window.external.AddFavorite(url, title); return false; ) if (isMac || isWebkit) ( // Webkit (Chrome, Opera)، Mac document.getElementById("AddFavViaSheens").innerHTML = "اضغط على "" + (isMac ? "Command/Cmd" : "Ctrl") + " + D" لوضع إشارة مرجعية على الصفحة" ; عودة كاذبة؛

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



 


يقرأ:



ما هو دفع الثقة MTS؟

ما هو دفع الثقة MTS؟

يتم حاليًا توفير خدمات إقراض الأموال للمشتركين من قبل جميع شركات الهاتف المحمول تقريبًا. الحاجة إلى...

برنامج مكافآت إيروفلوت: كيف تجمع الأميال وما الذي يمكنك إنفاقها عليه؟

برنامج مكافآت إيروفلوت: كيف تجمع الأميال وما الذي يمكنك إنفاقها عليه؟

إيروفلوت هي الشركة الرائدة في مجال الطيران المدني الروسي. وهو يعادل الناقل الجوي الوطني. تأسست الشركة عام 1923...

كيفية معرفة محرك الأقراص الموجود على جهاز الكمبيوتر الخاص بك: SSD أو HDD كيفية معرفة محرك الأقراص SSD الموجود على جهاز الكمبيوتر الخاص بك

كيفية معرفة محرك الأقراص الموجود على جهاز الكمبيوتر الخاص بك: SSD أو HDD كيفية معرفة محرك الأقراص SSD الموجود على جهاز الكمبيوتر الخاص بك

ستتعلم في هذه المقالة كيفية التعرف على الخصائص الرئيسية لمحركات الأقراص ذات الحالة الصلبة، بالإضافة إلى كيفية اختبارها. لهذه العملية...

اختبار التصميم الكسري تحديد R5 التصميم الكسري تعريف R5 - هادئ وواسع

اختبار التصميم الكسري تحديد R5 التصميم الكسري تعريف R5 - هادئ وواسع

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

صورة تغذية آر إس إس