Bagaimana untuk membuat butang "tambah pada kegemaran". Tambahkan pada kegemaran pada jQuery Js ketahui bahawa halaman itu ditandakan

Pengguna yang melayari Internet kerap mencari kandungan, gambar, video atau tapak permainan yang menarik yang mereka ingin simpan untuk dilawati kemudian. Sesetengah orang menambah pautan ke buku nota dengan cara lama dan seseorang membuka sumber web kegemaran mereka melalui sejarah lawatan. Tetapi ini bukanlah cara yang paling mudah, kerana semua penyemak imbas moden mempunyai fungsi yang berkesan yang dengannya anda boleh dengan cepat (dengan hanya 1 klik) menanda halaman tapak.

Bagaimana untuk menanda halaman halaman dalam penyemak imbas

Terdapat beberapa jenis penanda halaman dalam penyemak imbas:

  1. Penanda buku standard;
  2. Penanda buku visual;

Selain itu, standard ini disokong oleh semua pelayar popular: Google Chrome, Opera, Mozilla Firefox, pelayar Yandex.

Mari kita fikirkan cara untuk menanda halaman halaman dalam penyemak imbas, setiap pilihan.

Bagaimana untuk menanda halaman laman web dalam penyemak imbas

Untuk menambah halaman tapak pada penanda halaman biasa, anda harus:

  1. Buka halaman untuk disimpan;
  2. Di penjuru kanan sebelah atas penyemak imbas, klik pada ikon bintang (dalam Opera - hati).
    Semuanya! Penanda halaman ditambahkan!

Selain itu, anda boleh menanda halaman dengan cepat menggunakan kekunci pintas: Ctrl+D .

Bagaimana untuk membuka penanda halaman yang disimpan

Intinya kecil - anda perlu belajar cara membuka halaman yang ditanda halaman. Dan anda boleh melakukan ini dalam beberapa cara:


Cara menambah tapak pada penanda halaman visual

Malangnya, anda tidak boleh menambah tapak pada penanda halaman visual dalam Google Chrome dengan cara standard. Penanda halaman visual Chrome menunjukkan tapak yang paling banyak dilawati dan pengguna tidak mempunyai peluang untuk mengeditnya atau menambah tapak baharu. Anda hanya boleh memadam. Tetapi ada jalan keluar! Anda boleh memasang sambungan .

Dengan sambungan ini, urutan tindakan untuk semua penyemak imbas akan hampir sama.


Perkhidmatan dalam talian untuk menambah tapak pada penanda halaman

Alternatif untuk menambah penanda halaman menggunakan alat penyemak imbas standard ialah perkhidmatan dalam talian yang melaksanakan semua fungsi yang sama.

Hello. Mari kita bercakap tentang cara membuat pautan atau butang untuk menambah kegemaran (penanda halaman) untuk semua penyemak imbas: Chrome, Firefox, Opera, Internet Explorer, Safari - penyemak imbas silang, supaya apabila pengguna mengklik padanya, dia boleh menangguhkan dan ingat halaman anda. Sememangnya, pastikan kandungan itu menarik, jika tidak, tiada siapa yang akan menanda buku itu :)
Jadi mari kita pergi.

Perkara yang hendak ditambahkan pada HTML

Tambahkan pada penanda halaman

Masukkan kod di mana-mana tempat yang anda perlukan. Semua tetapan kecuali yang disenaraikan di bawah boleh ditukar atau dipadamkan.

  • id="fav"
    Arahan untuk Chrome, Opera dan semua pelayar berdasarkan enjin Webkit akan ditulis di sini
  • rel="bar sisi"
    Atribut diperlukan, diperlukan untuk Firefox, jadi ia akan menentukan bahawa halaman melalui pautan harus dihantar Kepada kegemaran
  • href=""
    Ia juga dinasihatkan untuk membiarkannya tidak berubah. Firefox akan mengambil pautan penanda halaman di alamat ini

    Jika kehendak saya, saya akan menggantikan a dengan span , tetapi pilihan ini tidak akan berfungsi di bawah Firefox

  • onclick="addFav()"
    Di sinilah skrip javascript akan ditakrifkan. Lagi tentang dia

Perkara yang perlu ditambahkan pada JavaScript

// Berfungsi untuk menanda buku kegemaran | https://site?p=710 function 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; if ( (isIE || isFF) && window.external) ( // IE, Firefox window.external.AddFavorite(url, title); return false; ) jika (isMac || isWebkit) ( // Webkit (Chrome, Opera), Mac document.getElementById("AddFavViaSheens").innerHTML = "Tekan "" + (isMac ? "Command/Cmd" : "Ctrl") + " + D" untuk menanda halaman ini"; return false; ) )

Sama ada alihkan kod ke fail luaran atau letakkan di mana-mana tempat pada halaman yang anda suka, contohnya, dalam bahagian atau sebelum tag penutup
Kod itu diulas, saya fikir tidak ada yang rumit. Jika anda mempunyai sebarang soalan - tanya dalam komen.

Cara Mengelakkan Memaparkan Pautan Kegemaran pada Tablet dan Penyemak Imbas Mudah Alih

Sudah tentu, tidak masuk akal untuk menunjukkan pautan untuk ditambahkan pada kegemaran pada peranti mudah alih, ia tidak akan berfungsi di sana. Oleh itu, anda perlu menapisnya.
Untuk melakukan ini, anda boleh, sebagai contoh, menjana pautan menggunakan javascript, dan ia sudah menapis segala-galanya seperti yang sepatutnya

// Fungsi untuk mengesan fungsi mobiliti pelayar 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 ; ) // Jika penyemak imbas BUKAN mudah alih, paparkan pautan jika (!MobileDetect())( document.getElementById("MyID").innerHTML = " Di sini kod pautan HTML (lihat di atas)"; )

Mari kita pecahkan sedikit

  • varUA = navigator.userAgent.toLowerCase(); - menulis tajuk penyemak imbas kepada pembolehubah, menukarnya kepada huruf kecil. Dengan kandungannya, kami akan menentukan "mobiliti" penyemak imbas.
  • return (/Regular expression/.test(UA) ? true: false) ialah penapis. Ungkapan biasa mengandungi serpihan yang boleh ditemui dalam pengepala penyemak imbas mudah alih. Anda boleh menambah nilai anda sendiri dengan memisahkannya dengan | .

    Penapis adalah sensitif huruf besar-besaran. Oleh itu, jika anda memasukkan nilai anda ke dalam penapis, pastikan anda menulisnya dalam huruf kecil (dalam huruf kecil).

  • document.getElementById("MyID").innerHTML = "Berikut ialah kod HTML untuk pautan"; — cari tag dengan id="MyID" dalam kod dan tulis pautan kami. Untuk menjadikannya berfungsi, anda mesti menulis dahulu di tempat untuk memaparkan pautan

Contoh skrip dan halaman yang telah siap

Biar saya ringkaskan bagaimana kod html itu mungkin kelihatan pada akhirnya

Kaedah ini sah untuk 2017. Ada kemungkinan bahawa dari masa ke masa, versi pelayar baharu akan membuat pelarasan mereka sendiri, dan skrip akan berhenti berfungsi. Jika anda melihat kegagalan sedemikian, tulis dalam ulasan, kami akan menyemak dan mengemas kini kod.

Pada satu masa, pautan "Tambah tapak pada kegemaran" popular di tapak, apabila diklik, alamat tapak telah ditandakan dalam penyemak imbas. Namun, mengapa ia berlaku? Secara berkala, pautan sedemikian masih ditemui di tapak. Masalahnya ialah skrip yang digunakan untuk tujuan ini tidak berfungsi dalam banyak penyemak imbas, jadi nilainya hampir kepada sifar. HTML5 memanjangkan keupayaan atribut tag rel dan kini dengan bantuannya anda boleh menambahkan mana-mana tapak dan halaman individu ke kegemaran anda dengan mudah.

Ia cukup untuk menambah rel="sidebar" pada pautan dan apabila anda mengklik padanya, panel khas akan dibuka dalam penyemak imbas untuk membuat penanda halaman baharu. Walaupun nilai bar sisi disokong oleh dua pelayar - Firefox dan Opera, selebihnya mengabaikan atribut rel dan ikut pautan yang ditentukan seperti biasa.

Untuk mengembangkan bilangan pelayar dan menambah IE padanya, anda juga boleh menyambungkan skrip kecil ke pautan. Akibatnya, ternyata Firefox, Opera, Internet Explorer akan memanggil panel khas, pelayar lain akan mengikuti pautan (contoh 1).

Contoh 1: Tambahkan pada kegemaran

HTML5 IE Cr Op Sa Fx

Tambahkan pada kegemaran

Tambahkan pada kegemaran

Apakah rupa aplikasi rel="sidebar" pada akhirnya? Hasilnya bergantung pada penyemak imbas. Firefox, sebagai contoh, membuka tetingkap sedemikian (Gamb. 1).

nasi. 1. Tambahkan pada Kegemaran dalam Firefox

Dalam Opera, pandangannya agak berbeza, tetapi maknanya serupa (Rajah 2).

nasi. 2. Menambah pada kegemaran dalam pelayar Opera

Internet Explorer mempunyai antara muka yang paling ringkas (Gamb. 3).

nasi. 3. Tambahkan pada Kegemaran dalam Internet Explorer

Walaupun penggunaan atribut rel adalah luar biasa kerana sokongan penyemak imbasnya yang lemah, ia mempunyai potensi besar, dan bilangan nilai secara beransur-ansur berkembang. Jadi ia harus dimasukkan ke dalam pautan.

Selepas beberapa penggalian, akhirnya saya menemui penyelesaian cantik yang berfungsi dalam semua pelayar.

Tambahkan pada kegemaran

Tambahkan pada kegemaran - skrip untuk semua penyemak imbas

Tambahkan pada kegemaran

Tukar Nama Tapak dan URL di 2 tempat! Berfungsi di mana-mana tanpa ralat)

Mulakan - skrip untuk IE

buat laman utama

Kami menukar URL di 2 tempat! Hanya berfungsi dalam IE

Pautan "Tambah pada Kegemaran" JavaScript untuk semua penyemak imbas

Skrip itu ditemui di google dan diubah suai dengan mengambil kira realiti semasa, iaitu, kehadiran versi ke-8 IE dan pelayar Chrome (yang dalam bentuk asalnya ditakrifkan sebagai Netscape oleh skrip dan tiada tindakan diambil sebagai hasilnya. ). Jika penyemak imbas tidak menyokong penambahan pada penanda halaman melalui skrip, pengguna akan ditunjukkan mesej yang menyatakan perkara yang boleh ditambahkan pada penanda halaman dengan menekan Ctrl-D.

Letakkan fungsi ini di kepala halaman:

Apa lagi yang perlu dibaca