Tạo Link Scroll Trên Web – Bấm Link Nhảy Tới Vị Trí Bất Kỳ Trên Trang

Chào bạn có phải bạn muốn làm một link sau khi bấm vào nó sẽ nhảy tới một vị trí nào đó trên trang web đúng không? Bình hướng dẫn bạn như sau nhé.

Bước 1 bạn gắn link: Bạn có thể gắn link trên trang hoặc Menu, link có dạng hashtag.

Link dạng thế này nè: abc.com/page1#dat-mua

Thì khi người ta click vào link này thì website sẽ tự nhảy tới dòng mã code có thuộc tính id là dat-mua.

<div id=”dat-mua”>

Ví dụ: nhảy xuống cuối cùng

Bước 2 bạn chèn id vào vị trí muốn scroll tới: bước này liên quan tới mã code nên bạn bật qua chế độ text của WordPress để chèn vào

Copy đoạn mã sau và thay thế lại id (hagtag): <div id=”dat-mua”></div>

Sau đó vào phần text tìm tới vị trí cần scroll tới sau đó dán đoạn mã này.

dan ma

 

<div id=”diem-cuoi”></div>

Ví dụ: nhảy lên điểm đầu

Xin thông báo đến bạn đọc Sách Thiết Kế Web Siêu Tốc đã không còn được phân phối do đã có phiên bản mới hơn thay thế.

Đó là bộ Giáo Trình Thiết Kế Web Siêu Tốc 2.0 với cập nhật mới nhất, bài bản và chi tiết dành các bạn đang cần thiết kế web cho riêng mình.

Xem thông tin bộ giáo trình mới Xem Bộ Giáo Trình Thiết Kế Web Siêu Tốc 2.0

Tìm trên Google:

  • https://yandex ru/clck/jsredir?from=yandex ru;search;web;;&text=&etext=1828 OBbki2L7CKWfgMGpM0JasfpAto9Fhc85ILOok7nsQOShi9yVW1kvf6Lqmdzj4gZe 273877c919a1d60d0dddaa48f9533684680058b9&uuid=&state=_BLhILn4SxNIvvL0W45KSic66uCIg23qh8iRG98qeIXme

Comments

  1. Huy

    a Bình ơi có cách nào làm cho khi click vào link thì trang nó cuộn từ từ chứ không bụp cái nhảy đến vị trí cần đến không ?
    A hướng dẫn cho e với, thank a nhiều lắm !

    1. Post
      Author
  2. Trường

    Bạn cho mình hỏi, nếu làm cách này links sẽ có thêm 1 đoạn ví dụ /#diem-cuoi . vậy có ảnh hưởng gì tới SEO không, vì mình thấy nó thay đổi links

    1. Post
      Author
      Đặng Ngọc Bình

      Chào Trường,

      Không ảnh hưởng SEO đâu bạn à. Bởi vì đây là link trong trang. Google thừa sức biết dấu # trong link là hagtag nhảy tới các vùng trong page. Nên nó hiểu đó là các vùng nhỏ trong trang và biết đâu là link chính để tránh trường hợp duplicate content.

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *