Bỏ qua đến nội dung chính

Làm thế nào để thêm một hiệu ứng thị sai trên bất kỳ chủ đề WordPress

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

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

hơn Tải xuống 701.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í. [Khuyến nghị]

Gần đây, một độc giả của chúng tôi đã hỏi chúng tôi về cách thêm hiệu ứng thị sai vào bất kỳ chủ đề WordPress nào?

Hiệu ứng thị sai là một xu hướng phổ biến ngày nay trên web, nơi hình ảnh nền cuộn chậm hơn nội dung nền trước.

Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách dễ dàng thêm hiệu ứng thị sai vào bất kỳ chủ đề WordPress nào.

Nhưng, nếu bạn chưa bao giờ cài đặt WordPress, hãy khám phá Làm thế nào để cài đặt một bước 7 blog WordPress et Làm thế nào để tìm kiếm, cài đặt và kích hoạt một chủ đề WordPress trên blog của bạn 

Nhưng trở lại lý do tại sao chúng ta ở đây.

Cách thêm hiệu ứng thị sai vào bất kỳ chủ đề wordpress nào e1567702269161

Hiệu ứng thị sai là gì?

Hiệu ứng thị sai là một kỹ thuật thiết kế web hiện đại trong đó yếu tố nền cuộn chậm hơn nội dung nền trước. Hiệu ứng này tạo thêm chiều sâu cho ảnh nền và làm cho chúng có tính tương tác.

Khám phá của chúng tôi Các chủ đề 25 WordPress với thị sai để tạo một trang web

Hiệu ứng thị sai có thể được sử dụng trên trang đích, trang bán hàng hoặc trang chủ của trang web doanh nghiệp. Đó là một cách tuyệt vời để đánh dấu các phần khác nhau trên một trang dài.

Nhiều chủ đề WordPress cao cấp có hiệu ứng thị sai tích hợp trên trang chủ của họ. Bạn cũng có thể sử dụng hiệu ứng thị sai với hầu hết các plugin WordPress tạo hình ảnh của các trang.

Tuy nhiên, không phải tất cả các chủ đề WordPress đều có hiệu ứng thị sai tích hợp và bạn có thể không muốn sử dụng một hàm tạo trực quan của các trang chỉ để tạo hiệu ứng thị sai.

Hãy cùng xem cách dễ dàng thêm hiệu ứng thị sai vào bất kỳ chủ đề WordPress nào.

Phương pháp 1: Thêm hiệu ứng thị sai vào bất kỳ chủ đề WordPress nào bằng cách sử dụng plugin

Phương pháp này không yêu cầu thêm bất kỳ mã nào vào chủ đề WordPress của bạn. Nó dễ dàng hơn và được khuyến nghị cho hầu hết người dùng.

Điều đầu tiên bạn cần làm là cài đặt và kích hoạt plugin Hình nền WordPress nâng cao. Để biết thêm chi tiết, xem hướng dẫn từng bước của chúng tôi về cách cài đặt plugin WordPress.

Sau khi kích hoạt plugin, bạn cần chỉnh sửa trang mà bạn muốn thêm hiệu ứng thị sai. Bạn sẽ nhận thấy nút mới "Hình nền WordPress nâng cao»Trên thanh công cụ của trình soạn thảo trực quan.

Thêm nền wordpress nâng cao

Nhấp vào nó sẽ xuất hiện một cửa sổ bật lên, nơi bạn có thể thay đổi các cài đặt nền khác nhau mà bạn muốn thêm.

Trước hết, bạn cần chọn một hình ảnh làm nền và sau đó đánh dấu vào tùy chọn " Căng ra'.

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

Elementor cho phép bạn dễ dàng tạo ra bất kỳ thiết kế trang web nào với một cái nhìn chuyên nghiệp. Ngừng trả tiền đắt cho những gì bạn có thể tự làm. [Miễn phí]

Nền cửa sổ wordpress nâng cao

Sau đó, bạn phải bấm vào nút Chọn ảnh Để tải xuống hoặc chọn một hình ảnh bạn muốn sử dụng. Hãy chắc chắn rằng bạn sử dụng một hình ảnh lớn nếu không nó sẽ xuất hiện pixelated.

Sau đó, bạn phải kích hoạt hiệu ứng Thị sai Bằng cách chọn một loại hiệu ứng thị sai. Có một số kiểu có sẵn mà bạn có thể thử nghiệm. Hiệu ứng thị sai phổ biến nhất được sử dụng là cuộn.

Nhấp vào nút Chèn để tiếp tục.

Plugin sẽ thêm một mã ngắn trên của bạn nhà xuất bản. Nó sẽ trông như thế này:

[nk_awb awb_type = "image" awb_stretch = "true" awb_image = "22" awb_image_size = "full" awb_image_s ở đây [/ nk_awb]

Thay thế " nội dung này Bằng nội dung của riêng bạn, sau đó lưu trang của bạn.

Bạn có thể truy cập trang web của bạn để xem nó trong hành động.

Hiệu ứng thị sai trên wordpressPhương pháp 2: Thêm hiệu ứng "Thị sai" vào bất kỳ chủ đề WordPress nào có CSS

Phương pháp này đòi hỏi bạn phải có một số kiến ​​thức về "HTML / CSS" cũng như cách các chủ đề và plugin WordPress hoạt động.

Trước tiên, bạn cần tải lên thư viện phương tiện WordPress của mình, hình ảnh bạn muốn sử dụng cho hiệu ứng thị sai bằng cách truy cập " media> Thêm mới '.

Đi xa hơn bằng cách khám phá Làm thế nào để tổ chức truyền thông trên blog WordPress của bạn

Sau khi tải hình ảnh lên, bạn cần sao chép URL của hình ảnh bằng cách chỉnh sửa hình ảnh trong thư viện phương tiện WordPress.

Sao chép url hình ảnh vào wordpress

Sau đó, bạn cần thêm mã HTML sau vào trang mà bạn muốn hiển thị hiệu ứng thị sai. Bạn cũng có thể thêm mã HTML này vào Chủ đề WordPress hoặc chủ đề con của bạn.

div class = "parallax"> Nội dung của bạn ở đây ...

Sau đó, bạn cần thêm mã CSS tùy chỉnh sau vào chủ đề WordPress của mình.

Bạn đang tìm kiếm các plugin và plugin WordPress tốt nhất?

Tải xuống các plugin và WordPress chủ đề tốt nhất trên Envato và dễ dàng tạo trang web của bạn. Đã tải xuống nhiều hơn 49.720.000. [ĐỘC QUYỀN]

.parallax {background-image: url ("http://example.com/wp-content/uploads/2017/08/my-background-image.jpg"); chiều cao: 100%; background-attachment: cố định; vị trí nền: trung tâm; lặp lại: không lặp lại; background-size: bao gồm; margin-left: -410px; margin-right: -410px; } .parallax-content {width: 50%; lề: 0 tự động; color: #fff; padding-top: 50px; }

Hãy nhớ thay thế URL của hình nền bằng hình ảnh của chính bạn.

Bây giờ bạn có thể lưu các thay đổi của bạn và truy cập trang web của bạn.

Ví dụ về hiệu ứng thị sai trong Wordpress

Đây là ! Bây giờ bạn có thể thêm hiệu ứng thị sai vào trang web WordPress của mình.

Khám phá thêm một số chủ đề và plugin WordPress cao cấp  

Bạn có thể sử dụng các plugin WordPress khác để mang lại cái nhìn hiện đại và tối ưu hóa độ bám của blog hoặc trang web của bạn.

Chúng tôi cung cấp cho bạn ở đây một số plugin WordPress cao cấp sẽ giúp bạn làm điều đó.

1. Sự đóng góp của WooCommerce

Chấp nhận thông qua các khoản đóng góp cho phần mở rộng này trên trang web WooCommerce của bạn với số tiền do khách hàng chỉ định. Họ sẽ có thể cho bao nhiêu tùy thích. Mỗi đóng góp có thể được trình bày như bất kỳ sản phẩm thông thường nào của WooCommerce


Plugin quyên góp Woocommerce

Nếu khách hàng bỏ qua trang giỏ hàng hoặc đến thẳng thanh toán mà không đóng góp, một liên kết sẽ xuất hiện phía trên trang thanh toán để họ có thể quyên góp.

Mỗi bước sử dụng WooCommerce Donation được giải thích trong tài liệu có ảnh chụp màn hình. Chỉ cần kích hoạt plugin và bạn sẽ tìm thấy trường "Thêm đóng góp" trên giỏ hàng.

Tải về | Bản demo Web hosting

2. LinkedIn khác

LinkedIn Plus là một plugin WordPress cho phép bạn trình bày hồ sơ LinkedIn của bạn trên blog của bạn. Nó cũng hoạt động cho các blog nhiều tác giả. Nó thêm các nút Theo dõi và Chia sẻ vào các ấn phẩm, trang hoặc widget WordPress của bạn.Linkedin cộng với plugin LinkedIn wordpress

Đó là một cách tuyệt vời để thêm tất cả các tính năng của LinkedIn vào blog của bạn và xác nhận thương hiệu của bạn với người tiêu dùng. Nó cung cấp cho bạn khả năng tùy chỉnh giao diện của nó, cấu hình cài đặt và kích hoạt các tùy chọn nâng cao khác để quảng bá hồ sơ của bạn cho các nhà tuyển dụng hoặc nhà tuyển dụng tiềm năng. 

Tải về | Bản demo | Web hosting

3. dùng Youtube

YouTubeR là một plugin WordPress độc đáo, cho phép bạn tải video YouTube lên từ trang web của mình và dễ dàng nhúng video, danh sách phát và kênh YouTube vào trang web của bạn.

Youtuber youtube plugin wordpress

Với plugin này, bạn có cơ hội tạo các phòng trưng bày video đặc biệt trên trang web của mình.

Các tính năng khác của nó là: khả năng dễ dàng tải video lên YouTube từ trang web WordPress của bạn, tích hợp video dễ dàng, danh sách phát và các kênh YouTube vào trang web của bạn, hỗ trợ cho Trình soạn thảo trực quan, cuộn vô hạn trong danh sách phát, bộ nhớ đệm tuyệt vời, bố cục đáp ứng, tài liệu chi tiết và nhiều hơn nữa.

Dễ dàng tạo Cửa hàng trực tuyến của bạn

Tải xuống miễn phí WooCommerce, 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. [Đề xuất]

Tải về | Bản demo | Web hosting

Tài nguyên đề xuất

Tìm hiểu về các tài nguyên được đề xuất khác để giúp bạn xây dựng và quản lý trang web của mình.

Kết luận

Đó là tất cả! Chúng tôi hy vọng nó đã được giúp đỡ rất nhiều. Đừng ngần ngại chia sẻ với bạn bè của bạn trên các mạng xã hội yêu thích của bạn

Tuy nhiên, bạn cũng sẽ có thể tham khảo ý kiến ​​của chúng tôi ressources, nếu bạn cần thêm các yếu tố để thực hiện các dự án tạo trang Internet của mình, bằng cách tham khảo hướng dẫn của chúng tôi về Tạo blog WordPress.

Và nếu bạn có bất kỳ đề xuất hoặc nhận xét nào, hãy để lại chúng trong phần của chúng tôi ý kiến.

... 

Bài viết này chứa comments 0

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

Địa chỉ email của bạn sẽ không được công bố. Các trường bắt buộc được đánh dấu *

Trang web này sử dụng Akismet để giảm bớt không mong muốn. Tìm hiểu thêm về cách sử dụng dữ liệu nhận xét của bạn.

Trở lại đầu trang
6 cổ phiếu
cổ phiếu3
tweet
Enregistrer3