Cách thay đổi chiều cao và chiều rộng khối trong WordPress

Tác giả sysadmin, T.Tư 22, 2023, 03:46:42 CHIỀU

« Chủ đề trước - Chủ đề tiếp »

0 Thành viên và 1 Khách đang xem chủ đề.

Cách thay đổi chiều cao và chiều rộng khối trong WordPress


Bạn có muốn thay đổi chiều cao và chiều rộng của khối trong WordPress không?

Theo mặc định, WordPress giúp dễ dàng tạo bố cục nội dung đẹp mắt cho các bài đăng và trang của bạn bằng cách sử dụng các khối. Tuy nhiên, đôi khi bạn có thể muốn thay đổi kích thước các khối để làm cho chúng trông đẹp hơn.

Trong bài viết này, chúng tôi sẽ chỉ cho bạn cách dễ dàng thay đổi chiều cao và chiều rộng khối trong WordPress.

Tại sao thay đổi chiều cao và chiều rộng khối trong WordPress?

Trình chỉnh sửa khối cho phép bạn thêm nội dung vào trang web WordPress của mình bằng các khối khác nhau, bao gồm tiêu đề, đoạn văn, hình ảnh, video, âm thanh, v.v.

Tuy nhiên, đôi khi bạn có thể muốn thay đổi chiều rộng hoặc chiều cao của một khối cụ thể để cải thiện hình thức của nó hoặc bố cục của nội dung tổng thể.

Việc điều chỉnh kích thước khối cũng có thể đảm bảo rằng nội dung của bạn phản hồi nhanh và hiển thị chính xác trên tất cả các thiết bị, bao gồm cả điện thoại, máy tính bảng và máy tính xách tay.

Ví dụ: bạn có thể đã tải lên một hình ảnh trong trình chỉnh sửa nội dung, nhưng hình ảnh đó quá lớn và khiến trang trông không hấp dẫn.


Hoặc, bạn có thể muốn thay đổi kích thước của khối tiêu đề để căn chỉnh nó phù hợp hơn với nội dung.

Bằng cách điều chỉnh chiều rộng và chiều cao của các khối, bạn có thể làm cho các bài đăng và trang của mình trông thẩm mỹ hơn.

Nói như vậy, hãy xem cách bạn có thể dễ dàng thay đổi chiều cao và chiều rộng của khối trong WordPress.

1. Phương pháp 1: Thay đổi Chiều cao và Chiều rộng của Khối bằng Cài đặt Khối

Đối với phương pháp này, chúng tôi sẽ chỉ cho bạn cách thay đổi chiều cao và chiều rộng của khối bằng cài đặt mặc định do WordPress cung cấp.

Hiện tại, WordPress không cung cấp các tùy chọn thay đổi kích thước giống nhau cho tất cả các khối. Tuy nhiên, trình chỉnh sửa khối cung cấp nhiều cách để thay đổi kích thước chiều cao và chiều rộng của các khối khác nhau.

Hãy bắt đầu với khối Hình ảnh trong WordPress.

Trước tiên, bạn có thể thay đổi căn chỉnh của khối Hình ảnh bằng cách nhấp vào nút 'Căn chỉnh' trên thanh công cụ phía trên khối.

Ở đây, chọn tùy chọn 'Chiều rộng' sẽ làm cho khối có cùng chiều rộng với vùng chứa.

Hoặc, tùy chọn căn chỉnh 'Toàn bộ chiều rộng' sẽ làm cho khối có toàn bộ chiều rộng của trang.


Bạn cũng có thể thay đổi kích thước khối bằng cách đi tới bảng 'Cài đặt khối' ở bên phải và cuộn xuống phần 'Cài đặt'. Từ đây, bạn có thể thay đổi kích thước khối từ menu thả xuống 'Kích thước hình ảnh'.

Bạn cũng có thể điều chỉnh chiều rộng và chiều cao của khối bằng cách nhập kích thước pixel ưa thích vào hộp 'Chiều rộng' và 'Chiều cao' trong phần 'Kích thước hình ảnh'.

Bên dưới đó, bạn cũng có thể điều chỉnh kích thước của khối theo tỷ lệ phần trăm.


Một cách khác để thay đổi kích thước khối Hình ảnh là nhấp vào chính hình ảnh đó để hiển thị đường viền màu xanh với các neo hình tròn.

Sau đó, chỉ cần kéo các neo này để thay đổi chiều cao và chiều rộng của khối hình ảnh.


Khi bạn đã hoàn tất, hãy nhấp vào nút 'Cập nhật' hoặc 'Xuất bản' để lưu cài đặt của bạn.

2. Phương pháp 2: Thay đổi Chiều cao và Chiều rộng của Khối bằng Khối Cột

Nếu khối bạn muốn thay đổi kích thước không đi kèm với các nút căn chỉnh hoặc cài đặt thay đổi kích thước, thì phương pháp này là dành cho bạn.

Đối với phương pháp này, chúng tôi sẽ đặt khối của chúng tôi bên trong khối Cột. Nó hoạt động như một thùng chứa nơi bạn có thể thêm các khối vào mỗi cột. Sau đó, bạn có thể thay đổi kích thước các khối đó bằng cách điều chỉnh chiều cao và chiều rộng của các cột.

Trước tiên, bạn cần nhấp vào nút 'Thêm khối' (+) ở góc trên cùng bên trái của màn hình.

Từ đây, chỉ cần định vị và thêm khối Cột vào trình chỉnh sửa nội dung. Sau đó, bạn sẽ được yêu cầu chọn một biến thể.


Sau đó, bố cục cột sẽ được hiển thị trên màn hình và bây giờ bạn có thể thêm khối bạn muốn bằng cách nhấp vào nút 'Thêm khối (+)' bên trong cột.

Khi khối đã được thêm vào, bạn có thể thay đổi kích thước khối bằng cách sử dụng 'Cài đặt cột' nằm trong bảng bên phải.


Khi bạn đã hoàn tất, chỉ cần nhấp vào nút 'Xuất bản' để lưu các thay đổi của bạn.

Đây là giao diện của nội dung trên trang web demo của chúng tôi sau khi thay đổi kích thước và căn chỉnh hai khối đoạn văn bên trong một khối hai cột.


3. Phương pháp 3: Thay đổi chiều cao và chiều rộng của khối bằng cách sử dụng khối nhóm

Bạn cũng có thể điều chỉnh chiều rộng và chiều cao của các khối bằng khối Nhóm. Nó cho phép bạn nhóm các khối khác nhau và tạo kiểu cho chúng lại với nhau.

Trước tiên, bạn cần nhấp vào nút 'Thêm khối' (+) ở trên cùng. Tiếp theo, bạn phải xác định vị trí và thêm khối Nhóm vào trình chỉnh sửa nội dung.

Khi bạn làm điều đó, khối Nhóm sẽ hiển thị ba tùy chọn bố cục khác nhau mà bạn có thể chọn. Đối với hướng dẫn này, chúng tôi sẽ sử dụng bố cục 'Nhóm'.


Sau đó, nút 'Thêm khối' sẽ hiển thị trên màn hình. Bây giờ bạn có thể thêm bất kỳ khối nào bạn muốn.

Trong hướng dẫn này, chúng tôi sẽ thêm và thay đổi kích thước khối Tiêu đề, khối Đoạn văn và khối Hình ảnh.


Để thêm nhiều khối vào Nhóm, bạn phải nhấp vào nút 'Chọn Nhóm' từ thanh công cụ khối.

Khi Nhóm được chọn, chỉ cần nhấp vào nút 'Thêm khối' (+) ở dưới cùng.


Nhấp vào nút 'Chọn nhóm' cũng mở ra cài đặt khối ở cột bên phải. Từ đây, bạn có thể dễ dàng điều chỉnh bố cục, căn chỉnh và hướng của tất cả các khối.

Thay đổi bố cục cũng sẽ thay đổi các kích thước khối khác nhau. Bạn có thể định cấu hình các cài đặt này cho đến khi hài lòng với kết quả.


Khi bạn đã hoàn tất, hãy nhấp vào nút 'Cập nhật' hoặc 'Xuất bản' để lưu cài đặt của bạn.

Đây là giao diện của khối Nhóm trên trang web demo của chúng tôi.


4. Phương pháp 4: Thay đổi chiều cao khối bằng Cover Block

Phương pháp thay đổi kích thước này dành cho bạn nếu bạn muốn sử dụng khối Cover. Nó cho phép bạn hiển thị văn bản và nội dung khác trên hình ảnh hoặc video.

Trước tiên, bạn cần nhấp vào nút 'Add Block' (+) ở trên cùng và tìm khối Cover.

Khi bạn đã hoàn thành việc đó, bạn sẽ được yêu cầu chọn màu hoặc tải lên hình ảnh từ thư viện phương tiện WordPress. Hình ảnh hoặc màu sắc này sẽ được dùng làm nền cho khối Cover.


Tiếp theo, bạn chỉ cần kéo và thả bất kỳ khối nào bạn muốn vào khối Cover.

Sau đó, bạn cần nhấp vào khối Cover để mở cài đặt khối của nó ở cột bên phải.

Từ đây, cuộn xuống bảng 'Kích thước', nơi bạn có thể điều chỉnh chiều cao của khối Bìa bằng pixel.


Cuối cùng, đừng quên nhấp vào nút 'Lưu thay đổi' để lưu cài đặt của bạn.

Để biết hướng dẫn chi tiết hơn về cách sử dụng khối Ảnh bìa, bạn có thể muốn xem hướng dẫn dành cho người mới bắt đầu của chúng tôi về Ảnh bìa so với Ảnh nổi bật trong trình chỉnh sửa khối WordPress.

Phần thưởng: Tạo các trang đẹp bằng các khối nâng cao trong SeedProd

Bạn có thể dễ dàng tạo các trang đẹp mắt và thẩm mỹ bằng cách sử dụng plugin SeedProd.

Đây là trình tạo trang WordPress tốt nhất trên thị trường cho phép bạn tạo các trang đích bằng cách sử dụng các khối. Các khối này cũng rất dễ tùy chỉnh và thay đổi kích thước theo nhu cầu của bạn.

Trước tiên, bạn sẽ cần cài đặt và kích hoạt plugin SeedProd. Để biết thêm chi tiết, bạn có thể đọc hướng dẫn của chúng tôi về cách cài đặt plugin WordPress.

Lưu ý: SeedProd cũng cung cấp phiên bản miễn phí nhưng chúng tôi sẽ sử dụng phiên bản cao cấp cho hướng dẫn này.

Sau khi kích hoạt, bạn phải truy cập trang SeedProd » Cài đặt từ bảng điều khiển WordPress của mình và nhập mã cấp phép vào hộp 'Khóa cấp phép'.

Bạn có thể tìm khóa cấp phép trên trang tài khoản của mình trên trang web SeedProd.


Tiếp theo, bạn cần truy cập màn hình SeedProd » Landing Pages  từ thanh bên quản trị để bắt đầu tạo trang đích.

Từ đây, chỉ cần nhấp vào nút 'Thêm trang đích mới'.


Bây giờ bạn sẽ được đưa đến trang 'Chọn Mẫu Trang Mới'. SeedProd cung cấp nhiều mẫu tạo sẵn mà bạn có thể chọn.

Sau khi bạn đã chọn một mẫu, bạn sẽ được yêu cầu cung cấp tên và URL cho trang đích của mình.

Sau khi thêm các chi tiết này, chỉ cần nhấp vào nút 'Lưu và Bắt đầu Chỉnh sửa Trang' để tiếp tục.


Thao tác này sẽ khởi chạy trình tạo trang kéo và thả của SeedProd, nơi bạn có thể bắt đầu chỉnh sửa trang của mình.

Để biết hướng dẫn chi tiết hơn, vui lòng xem hướng dẫn của chúng tôi về cách tạo trang đích bằng WordPress.

Đối với hướng dẫn này, chúng tôi sẽ thêm và thay đổi kích thước khối Hình ảnh và khối Nút.

Trước tiên, bạn sẽ cần kéo khối Hình ảnh từ bảng điều khiển khối ở bên trái và thả nó vào bất kỳ đâu bạn muốn trên trang.


Tiếp theo, chỉ cần nhấp vào khối Hình ảnh để mở cài đặt khối của nó ở cột bên trái. Từ đây, bạn có thể tải lên một hình ảnh từ thư viện phương tiện của mình.

Tiếp theo, bạn có thể thay đổi chiều cao và chiều rộng của khối bằng pixel hoặc tỷ lệ phần trăm.


Bạn cũng có thể điều chỉnh kích thước và vị trí hình ảnh bằng cách chuyển sang tab 'Nâng cao' ở đầu bảng cài đặt.

Sau đó, chỉ cần nhấp vào bảng Khoảng cách để mở rộng cài đặt của nó.


Tại đây, chỉ cần thêm các giá trị để điều chỉnh lề và phần đệm của khối theo nhu cầu của bạn.

Bạn có thể điều chỉnh lề và phần đệm cho các vùng trên cùng, dưới cùng, bên trái và bên phải của khối.


Với Seedprod, bạn cũng có thể thêm một khối Spacer giữa hai khối khác nhau để tạo khoảng cách giữa chúng.

Trước tiên, bạn cần xác định vị trí và thêm khối 'Spacer' từ cột bên trái. Sau đó, nhấp vào nó để mở cài đặt của nó.


Bây giờ, bạn có thể kiểm soát chiều cao của miếng đệm bằng thanh trượt 'Chiều cao'.

Khối đệm có thể giúp bạn tạo một trang web gọn gàng.


Bạn cũng có thể thay đổi chiều rộng và chiều cao của các khối khác theo cách tương tự, bao gồm các khối Video, Tiêu đề và Nút.

Chỉ cần tìm khối Nút ở cột bên trái và kéo nó vào trang của bạn.


Tiếp theo, bạn sẽ cần nhấp vào Nút để mở cài đặt khối của nó.

Từ đây, chuyển sang tab 'Nâng cao' từ trên cùng. Bạn có thể thay đổi chiều cao của khối bằng cách kéo thanh trượt 'Đệm dọc'.


Để thay đổi chiều rộng, hãy kéo thanh trượt 'Đệm ngang' ở cột bên trái.

Khi bạn đã hoàn tất, đừng quên nhấp vào nút 'Lưu'.


Chúng tôi hy vọng bài viết này đã giúp bạn tìm hiểu cách thay đổi chiều rộng và chiều cao khối trong WordPress. Bạn cũng có thể muốn xem bài viết của chúng tôi về cách thêm và căn chỉnh hình ảnh trong trình chỉnh sửa khối WordPress và các lựa chọn hàng đầu của chúng tôi về các plugin WordPress phải có để phát triển trang web của bạn.