[vc_row content_placement = "middle" css = ". vc_custom_1508940533685 {background-color: # f8f6f6! important;}" el_id = "themeforestpro"] [vc_column width = "3/4" css = ". vc_custom_1502759058885 {margin-bottom: 0 ! important; border-bottom-width: 0px! important; padding-bottom: 0px! important;} "] [vc_column_text]

Divi: chủ đề WordPress dễ sử dụng nhất

[/ vc_column_text] [/ vc_column] [vc_column width = "1/4"] [vcex_button url = "https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=23065&tid1=divibeforepostmobile" target = "blank" size = "small" align = "center" color = "green" font_family = "Raleway" font_weight = "600" style = "flat" custom_color = "# ffffff" custom_hover_color = "# ffffff"] TẢI XUỐNG [/ vcex_button] [/ vc_column] [/ vc_row]

Divi: Chủ đề WordPress tốt nhất mọi thời đại!

hơn Tải xuống 901.000, Divi là chủ đề WordPress phổ biến nhất trên thế giới. Nó là hoàn chỉnh, dễ sử dụng và đi kèm với hơn 62 mẫu miễn phí.

Hai mươi mười bảy là chủ đề mặc định linh hoạt nhất của WordPress từng thấy. Tuy nhiên, các tùy chọn được xây dựng trong chủ đề để lại một cái gì đó được mong muốn.

Trong hướng dẫn này, tôi sẽ chỉ cho bạn năm cách để tùy chỉnh chủ đề này cho phù hợp với blog của bạn. Chúng tôi sẽ bắt đầu với những điều cơ bản và chuyển sang các tùy chỉnh khó khăn và tác động hơn.

Khi chúng tôi hoàn thành, bạn sẽ có thể biến Twenty Seventeen thành một trang web đẹp và hiện đại cho doanh nghiệp hoặc blog. Bạn không tin tôi? Hãy nhìn xem, đây là những gì bạn có thể tạo ra:

Hai mươi mười bảy tùy chỉnh

#1 Tạo menu liên kết xã hội

Chà, phần đầu tiên này không chỉ là một bản hack. Nhưng đó là việc cá nhân hóa chỉ làm trên Twenty Seventeen.

Twenty Seventeen có một menu hấp dẫn cho các liên kết xã hội trên chân trang.

Hai mươi mười bảy liên kết xã hội

Vấn đề là một số người dùng đã báo cáo rằng họ gặp khó khăn khi tìm cách thêm các liên kết mạng xã hội của họ vào menu này. May mắn thay, nó thực sự rất đơn giản một khi bạn biết cách làm điều đó.

Tất cả những gì bạn phải làm là tạo một menu với các liên kết đến mạng xã hội của bạn và gán nó vào vị trí của Menu liên kết xã hội.

  • Hãy cùng khám phá trong suốt quá trình.
  • Bắt đầu bằng cách mở "Customizer" (Giao diện> Tùy chỉnh).
  • Chọn tùy chọn “Menu” rồi chọn “Menu liên kết xã hội”.
  • Đổi tên menu mới của bạn.
  • Thêm một liên kết đến mỗi mạng xã hội có sẵn.
  • Đánh dấu vào ô bên cạnh " Liên kết xã hội đơn '.

Khi hoàn thành, menu của bạn sẽ trông như thế này:

Dễ dàng tạo trang web của bạn với Elementor

Elementor cho phép bạn tạo Dễ dàng và Miễn phí bất kỳ trang web hoặc thiết kế blog với một cái nhìn chuyên nghiệp. Ngừng trả nhiều tiền cho một trang web mà bạn có thể tự làm.

Trang cá nhân hóa hai mươi mười bảy

Bước cuối cùng là nhấp vào nút “Lưu và Xuất bản” trong Customizer để lưu menu mới. Các liên kết của bạn đến các mạng xã hội bây giờ sẽ được hiển thị trong menu ở cuối trang.

# 2 Thay đổi chữ ký "Tự hào được cung cấp bởi WordPress"

Tình hình wordpress

Có hai lý do tại sao bạn có thể muốn chỉnh sửa văn bản trên chân trang có nội dung rằng trang web của bạn là "Tự hào được cung cấp bởi WordPress". "

Có thể bạn muốn mở rộng phần sau, bằng cách thêm văn bản bổ sung: “Tự hào được cung cấp bởi WordPress, Được thiết kế bởi WebPress Designs và được lưu trữ bởi LAMPress Hosting. "

Bạn có muốn bán sản phẩm của mình trên internet?

Tải xuống WooCommerce miễn phí, các plugin thương mại điện tử tốt nhất để bán các sản phẩm vật lý và kỹ thuật số của bạn trên WordPress và dễ dàng tạo cửa hàng trực tuyến của bạn. Hoàn hảo cho người mới bắt đầu.

Có lẽ bạn muốn thay đổi hoàn toàn chữ ký của bạn cho một cái gì đó cá nhân hơn.

Điều đầu tiên bạn cần làm là tạo và kích hoạt một chủ đề con (gợi ý: nếu bạn muốn đơn giản hóa cuộc sống của mình, hãy tải xuống chủ đề con định trước cho điều đó).

Khi bạn đã tạo và kích hoạt chủ đề con của mình, hãy sao chép tệp "footer.php". Sau đó, mở tệp "footer.php" này và tìm đoạn mã này: get_template_part ('template-Parts / footer / site', 'info');.

Bây giờ bạn có hai lựa chọn. Bạn có thể chỉ cần nhận xét dòng này bằng cách thêm "//" ngay trước mã hoặc bạn có thể xem xét thay thế nó bằng văn bản chân trang tùy chỉnh của riêng bạn. Đây là mã để thêm vào để tạo văn bản của chân trang.

Chân trang tùy chỉnh

Menu điều hướng nâng cao #3

Ngoài việc tạo menu điều hướng chức năng trên trang điều hướng, chúng tôi cũng sẽ sửa hiệu ứng di chuột của menu điều hướng và thêm tính năng cuộn mượt để cải thiện trải nghiệm tổng thể.

Trước tiên, chúng tôi sẽ bắt đầu thêm mã sau vào chủ đề (con) của bạn:

/ * Mã điều hướng một trang * / jQuery (tài liệu) .ready (function () {/ * Thêm phần đệm và id vào mỗi phần trang đầu * / jQuery ("h2.entry-title") .each (function () {var panelId = jQuery (this) .html (). toLowerCase (). Replace (/ s + / g, "-"); jQuery (this) .wrapInner (function () {return " ";})}) / * Xóa đánh dấu liên kết điều hướng * / jQuery ('# top-menu li'). RemoveClass ('current-menu-item current_page_item'); / * Thêm đánh dấu khi nhấp vào * / jQuery ('# top -menu li a '). on (' click ', function (event) {jQuery (this) .parent (). parent (). find (' li '). removeClass (' current-menu-item '); jQuery (this) .parent (). addClass ('current-menu-item');}); / * Kiểm tra URL hiện tại và đánh dấu điều hướng cho trang hiện tại * / jQuery ('# top-menu li a'). each (function () {var pageUrl = jQuery (location) .attr ('href'); var navUrl = jQuery (this) .attr ('href'); if (navUrl == pageUrl) {jQuery (this) .parent (). addClass ('current-menu-item');}})})

Bạn có thể thêm này mã trên một tập tin JavaScript được tải bởi một chủ đề con (những gì được đề nghị) hoặc sử dụng một plugin cho phép bạn thêm JavaScript vào trang web của mình. Đảm bảo tải mã sau khi jQuery đã tải xong.

Hãy xem các nhận xét trong mã để có được bức tranh đầy đủ về những gì đang xảy ra.

Bên cạnh đó, chúng ta có thể làm cho việc di chuyển đến từng bộ phận rất nhiều mượt mà bằng cách cài đặt và kích hoạt một plugin miễn phí: jQuery Cuộn mượt mà.

Tất nhiên, bạn vẫn sẽ cần xây dựng menu điều hướng của mình bằng cách thêm liên kết tùy chỉnh vào từng phần bằng tên của trang được hiển thị trong phần này.

Ví dụ: để liên kết đến phần "Giới thiệu", bạn cần tạo một liên kết tùy chỉnh và sử dụng " #about Là mỏ neo của liên kết. Để biết thêm chi tiết, hãy xem Cách tùy chỉnh chủ đề " Hai mươi mười bảy WordPress '.

Với một chút nỗ lực, bạn sẽ đạt được một kết quả thuyết phục:

Kết quả điều hướng hai mươi mười bảy

Đây chắc chắn không phải là tất cả những gì chúng ta có thể làm với Twenty Seventeen, sau này chúng tôi sẽ cung cấp các hướng dẫn khác về Twenty Seventeen.

15 cổ phiếu
cổ phiếu8
tweet1
Enregistrer6