Hướng dẫn tạo các nút liên hệ nhanh bằng HTML và CSS cho website WordPress

11281 lượt xem
Mẹo nhỏ: Để tìm kiếm chính xác các ấn phẩm của GiuseArt.com, hãy search trên Google với cú pháp: "Từ khóa" + "giuseart". (Ví dụ: thiệp tân linh mục giuseart). Tìm kiếm ngay

Chào các bạn, mình mới làm xong mấy nút liên hệ nhanh này thấy đẹp và hiệu quả nên chia sẻ lại code cho các bạn sử dụng nhé! Bài viết đặc biệt thích hợp với các bạn không biết code nên rất dễ sử dụng nha!

Tạo các nút liên hệ nhanh bằng HTML và CSS

Mình sử dụng HTML và CSS để tạo nên chắc chắn không tốn nhiều dung lượng, không làm website tải chậm đi và cũng rất dễ sử dụng đặc biệt cho các bạn không biết code.

Các bạn có thể nhìn hình để hình dung, hoặc vô xem tại website giuseart.com trên giao diện PC và mobile luôn nha!

Hướng dẫn tạo các nút liên hệ nhanh cho website bằng html và css
Hướng dẫn tạo các nút liên hệ nhanh cho website bằng html và css

Nào giờ ta bắt đầu luôn nhé!

Đối với theme Flatsome:

Bước 1: Truy cập vị trí gắn code

Trên thanh đen đen trên cùng – Flatsome – Advanced – Global Setting – Truy cập Footer Script

Bước 2: Paste toàn bộ đoạn code này vào:

Bước 3: Chỉnh sửa thông tin

Lưu ý: Các vị trí sau bạn có thể sửa theo ý 

Bước 4: Lưu lại và tận hưởng thành quả

Đối với theme bất kỳ không phải Flatsome

Bước 1: Copy code HTML và CSS

Các bạn truy cập Giao diện – Sửa – tìm truy cập vào file Footer.php.  Sau đó, các bạn copy toàn bộ đoạn code ở bước 1 (dành cho theme Flatsome) ở trên và paste vào giữa thẻ đóng </body> và </html>

Bước 3: Chỉnh sửa thông tin

Các bạn thực hiện các thao tác chỉnh sửa thông tin như ở trên mình hướng dẫn (cho theme Flatsome)

Bước 4: Lưu lại và tận hưởng thành quả

Cuối cùng, các bạn lưu lại và ra trang chủ xem sự thay đổi nha!

Lời kết

Cám ơn các bạn đã quan tâm theo dõi và ủng hộ GiuseArt.com trong suốt thời gian qua. Chúc các bạn có những trải nghiệm thú vị khi ghé thăm website.

5/5 - (2 bình chọn)
Chia sẻ bài viết:

Thông báo chính thức: Ninh Bình Web (thuộc GiuseArt) không hợp tác với bất kỳ ai để bán giao diện Wordpress và cũng không bán ở bất kỳ kênh nào ngoại trừ Facebookzalo chính thức.

Chúng tôi chỉ support cho những khách hàng mua source code chính chủ. Tiền nào của nấy, khách hàng cân nhắc không nên ham rẻ để mua phải source code không rõ nguồn gốc và không có support về sau! Xin cám ơn!

Thẻ tìm kiếm:

Bài viết mới cập nhật:

7 những suy nghĩ trên “Hướng dẫn tạo các nút liên hệ nhanh bằng HTML và CSS cho website WordPress

    • hoang nói:

      mình mới học. chưa có ai trả lời có thể dùng theo cách này ạ.
      thêm dòng 69 .giuseart-pc-contact-bar li.hotline{
      margin-bottom: 4px;
      background: url( đường dẫn ảnh điện thoại mới ảnh kích thước 44×44);
      background-repeat: no-repeat;
      }
      thêm dưới dòng 71 của thẻ là:

  1. dũng nói:

    admin có thể hỗ trơ đoạn code mà trên mobile nó hiển thị hàng dọc như trên pc chứ không phải là ngang như code này được không ? 🙂 thanks

Để lại một bình luận

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 *