Gửi ticket
Khuyến mại
Kiến thức
Quản lý dịch vụ
Cách sử dụng tiện ích SoundCloud
1. Các tiện ích Widgets trong Elementor
Widgets hay các tiện ích trong ngữ cảnh của Elementor (và rộng hơn là WordPress) là các khối nội dung có thể tái sử dụng, được thiết kế để thực hiện một chức năng hoặc hiển thị một loại thông tin cụ thể.
Khi bạn nhấp vào một widget trong khu vực chỉnh sửa chính, các tùy chọn chỉnh sửa cho widget đó sẽ xuất hiện trong Bảng điều khiển (Panel) bên trái. Mỗi widget thường có 3 tab chính:
- Content (Nội dung): Tùy chỉnh nội dung của widget (ví dụ: văn bản của tiêu đề, nguồn ảnh, URL nút bấm, v.v.).
- Style (Kiểu hiển thị): Tùy chỉnh giao diện (ví dụ: màu sắc, phông chữ, kích thước, căn chỉnh, border, shadow, v.v.).
- Advanced (Nâng cao): Các tùy chọn nâng cao như:
- Margin & Padding: Khoảng cách bên ngoài và bên trong phần tử.
- Z-index: Thứ tự hiển thị của các lớp phần tử.
- CSS ID & CSS Classes: Dùng để tùy chỉnh CSS bổ sung.
- Motion Effects (Hiệu ứng chuyển động): Ví dụ: hiệu ứng cuộn (scroll effects), hiệu ứng vào (entrance animation).
- Background: Màu nền, hình ảnh nền, gradient.
- Border: Đường viền.
- Positioning: Vị trí của phần tử (mặc định, tương đối, tuyệt đối, cố định).
- Responsive: Ẩn/hiện phần tử trên các thiết bị khác nhau.
- Custom CSS (Elementor Pro): Viết CSS tùy chỉnh.
2. Tiện ích SoundCloud là gì ?
Tiện ích SoundCloud trong Elementor cho phép bạn dễ dàng nhúng các bản nhạc, podcast hoặc nội dung âm thanh khác từ nền tảng SoundCloud vào trang web của mình. Đây là cách tuyệt vời để chia sẻ âm thanh mà không cần phải tự lưu trữ tệp.
3. Các bước sử dụng tiện ích SoundCloud là gì ?
Bước 1. Chỉnh sửa nội dung
Đây là nơi bạn nhập liên kết SoundCloud và điều chỉnh các tùy chọn hiển thị của trình phát.
1. Liên kết (Link):
- Đây là phần quan trọng nhất. Bạn cần dán đường dẫn (URL) của bản nhạc hoặc playlist SoundCloud mà bạn muốn nhúng.
- Ví dụ: https://soundcloud.com/user/track-name hoặc https://soundcloud.com/user/sets/playlist-name.
- Trong hình ở trên, liên kết đang là https://soundcloud.com/kitxchangngojin-c.
2. Trình phát trực quan (Visual Player):
- Gạt nút sang phải để bật trình phát trực quan (Visual Player). Khi bật, trình phát sẽ hiển thị với một dải sóng âm thanh lớn và hình ảnh bìa, tạo hiệu ứng trực quan hơn. Khi tắt, nó sẽ chỉ hiển thị trình phát nhỏ gọn.
- Tùy chọn này đang tắt (trình phát nhỏ gọn được hiển thị).
3. Tùy chọn bố cục (Layout Options):
- Tự động chơi (Autoplay): Gạt nút sang phải nếu bạn muốn bản nhạc tự động phát khi trang tải. (Thường không nên dùng vì có thể gây khó chịu cho người dùng).
- Nút mua (Show Buy Button): Gạt nút sang phải để hiển thị nút “Mua” (nếu bản nhạc có tùy chọn mua trên SoundCloud).
- Nút thích (Show Like Button): Gạt nút sang phải để hiển thị nút “Thích”.
- Nút tải xuống (Show Download Button): Gạt nút sang phải để hiển thị nút “Tải xuống” (nếu bản nhạc có tùy chọn tải xuống).
- Ảnh minh họa (Show Artwork): Gạt nút sang phải để hiển thị ảnh bìa của bản nhạc.
- Nút chia sẻ (Show Share Button): Gạt nút sang phải để hiển thị nút “Chia sẻ”.
- Bình luận (Show Comments): Gạt nút sang phải để hiển thị phần bình luận.
- Số lượt phát (Show Play Count): Gạt nút sang phải để hiển thị số lượt phát của bản nhạc.
- Tên tài khoản (Show Username): Gạt nút sang phải để hiển thị tên tài khoản của người đăng.
- Kiểm soát màu sắc (Show Controls): Gạt nút sang phải để hiển thị các điều khiển phát lại như tua đi/tua lại, thanh tiến trình.
Đây là nơi bạn tùy chỉnh màu sắc của trình phát SoundCloud.
A. SoundCloud (SoundCloud)
- Màu sắc (Color): Chọn màu chính cho trình phát SoundCloud. Màu này sẽ ảnh hưởng đến các yếu tố như thanh tiến trình, biểu tượng phát và các điểm nhấn khác trong trình phát.
- Trong hình bạn cung cấp, ô màu đang trống, có nghĩa là đang sử dụng màu mặc định của SoundCloud hoặc theme.
Bước 2. Chỉnh sửa nâng cao (Advanced)
Tab này cung cấp các tùy chọn nâng cao hơn để kiểm soát bố cục, hiệu ứng và khả năng đáp ứng của toàn bộ tiện ích SoundCloud.
- Bố cục (Layout):
- Margin (Lề): Khoảng cách bên ngoài tiện ích SoundCloud với các phần tử khác xung quanh.
- Padding (Khoảng đệm): Khoảng cách bên trong tiện ích.
- Width (Chiều rộng): Bạn có thể đặt chiều rộng của toàn bộ tiện ích SoundCloud.
- Position (Vị trí): Mặc định, Relative, Absolute, Fixed (các tùy chọn định vị nâng cao).
- Z-index: Xác định thứ tự xếp lớp của tiện ích nếu nó chồng lên các phần tử khác.
- CSS ID & CSS Classes:
- Cho phép bạn thêm ID hoặc class CSS tùy chỉnh để tác động đến tiện ích bằng mã CSS riêng.
- Hiệu ứng chuyển động (Motion Effects):
- Entrance Animation (Hoạt ảnh khi vào): Chọn hiệu ứng xuất hiện cho trình phát SoundCloud khi trang được tải.
- Hover Animation (Hoạt ảnh di chuột qua): Hiệu ứng chuyển động cho toàn bộ tiện ích khi di chuột qua.
- Scrolling Effects (Hiệu ứng cuộn): Tạo các hiệu ứng khi người dùng cuộn trang.
- Mouse Effects (Hiệu ứng chuột): Tạo các hiệu ứng khi di chuột qua tiện ích.
- Nền (Background):
- Bạn có thể thêm màu nền, hình nền hoặc gradient cho toàn bộ vùng chứa tiện ích SoundCloud.
- Đường viền (Border):
- Tùy chỉnh kiểu đường viền, độ dày, màu sắc và bán kính bo tròn cho toàn bộ vùng chứa tiện ích.
- Mặt nạ (Mask):
- Áp dụng một hình dạng mặt nạ để tạo hiệu ứng đặc biệt cho tiện ích.
- Khả năng đáp ứng (Responsive):
- Ẩn trên máy tính để bàn (Hide On Desktop), Ẩn trên máy tính bảng (Hide On Tablet), Ẩn trên thiết bị di động (Hide On Mobile): Cho phép bạn ẩn trình phát SoundCloud trên các loại thiết bị khác nhau nếu cần.
- Thuộc tính (Attributes):
- Cho phép bạn thêm các thuộc tính HTML tùy chỉnh cho thẻ tiện ích.
- CSS tùy chỉnh (Custom CSS) (chỉ có trong Elementor Pro):
- Cho phép bạn viết mã CSS trực tiếp để tùy chỉnh giao diện và hành vi của trình phát SoundCloud một cách nâng cao.
