Wooc Commerce nhận ID hình thu nhỏ của sản phẩm

Wooc Commerce – URL hình ảnh nổi bật và hình ảnh Thư viện

28 tháng 11 , 2014

quản trị viên

Wooc Commerce nhận ID hình thu nhỏ của sản phẩm
Wooc Commerce nhận ID hình thu nhỏ của sản phẩm

Nhận hình ảnh thư viện thương mại điện tử

                    <?php  global $product;
                         $attachment_ids = $product->get_gallery_attachment_ids();
                        foreach( $attachment_ids as $attachment_id ) 
                        {
                          echo $image_link = wp_get_attachment_url( $attachment_id );
                        }    ?>

Hình ảnh nổi bật của sản phẩm thương mại điện tử

<?php if ( has_post_thumbnail( $product->id ) ) {
                        $attachment_ids[0] = get_post_thumbnail_id( $product->id );
                         $attachment = wp_get_attachment_image_src($attachment_ids[0], 'full' ); ?>    
                        <img src="<?php echo $attachment[0] ; ?>" class="card-image"  />
                    <?php } ?>

var_dump($attachment_ids)

 array (size=4)
  0 => string 'http://localhost/wp-content/uploads/2014/11/bottle.png' (length=64)
  1 => int 350
  2 => int 500
  3 => boolean false

Hôm nay, Chúng tôi muốn chia sẻ với các bạn Woocommerce Get url hình ảnh sản phẩm. Trong bài đăng này, chúng tôi sẽ chỉ cho bạn Tải hình ảnh cho một sản phẩm hoặc biến thể sản phẩm, hãy nghe về Cách tải Url hình ảnh sản phẩm WooC Commerce, chúng tôi sẽ cung cấp cho bạn bản demo và ví dụ để triển khai. Trong bài đăng này, chúng ta sẽ tìm hiểu về Wooc Commerce nhận phòng trưng bày hình ảnh theo id sản phẩm với một ví dụ

Wooc Commerce Nhận url hình ảnh sản phẩm

nội dung

Có những điều sau đây Giới thiệu đơn giản về Nhận url hình ảnh sản phẩm trong wordpress Thông tin đầy đủ với ví dụ và mã nguồn

Vì tôi sẽ đề cập đến Bài đăng này với ví dụ Làm việc trực tiếp để phát triển WooC Commerce. Dễ dàng lấy thông tin sản phẩm (ID, SKU, $) từ đối tượng $product, do đó, lấy url hình ảnh sản phẩm từ id sản phẩm woocommerce cho ví dụ này như bên dưới

Nếu bạn muốn thay đổi cách chúng được hiển thị, bạn cần hiểu cách lấy sản phẩm WooC Commerce src

WooC Commerce Nhận hình ảnh sản phẩm src

Như tôi đã đề cập trước đây, WooC Commerce là một loại bài đăng tùy chỉnh và hình ảnh chính trên một trang chỉ đơn giản là hình ảnh nổi bật giống như hình ảnh nổi bật trong một bài đăng khác như bài đăng WordPress thông thường

Bạn có thể sử dụng đoạn mã sau để lấy URL của hình ảnh nổi bật của sản phẩm hiện tại

 
	
	if ( has_post_thumbnail(  $post-&gt;ID) ) {
            echo wp_get_attachment_url( get_post_thumbnail_id( $post-&gt;ID ) );            
	}     

Bước đầu tiên trong mã của tôi là lấy ID sản phẩm hiện tại. Tôi đã sử dụng đối tượng bài đăng toàn cầu và truy cập thuộc tính ID như trong mã bên dưới

$post toàn cầu;

tiếng vang $post->ID;

Như bạn có thể thấy mã khi được thêm vào hook hành động wp_header, bạn có thể hiển thị id sản phẩm như trong hình bên dưới

woocommerce get product image src 1

 

Bây giờ bạn có thể thêm mã đầy đủ vào tiêu đề để minh họa cách hiển thị URL của hình ảnh sản phẩm và mã đầy đủ cho tiêu đề như sau

 

add_action('wp_head', 'display_example_code_header_');

function display_example_code_header_(){
	
	global $post; 
	
	if ( has_post_thumbnail(  $post-&gt;ID) ) {
            echo wp_get_attachment_url( get_post_thumbnail_id( $post-&gt;ID ) );            
	}      
}

Khi bạn thêm mã này, bạn sẽ thấy src hình ảnh sản phẩm được hiển thị trên tiêu đề như trong hình bên dưới

woocommerce get product image src 2

Phần kết luận

Trong bài đăng này, chúng tôi đã xem xét cách lấy src hình ảnh sản phẩm trong WooC Commerce. Lấy từ hướng dẫn này là chức năng lấy hình ảnh sản phẩm và cả ID của sản phẩm hoặc bài đăng. Đó là hai yêu cầu làm nên điều kỳ diệu. Bạn có thể tiếp tục và sử dụng URL này để hiển thị hình ảnh hoặc tùy chỉnh nó để phù hợp với thiết kế của bạn

Hình ảnh sản phẩm là một thành phần thiết yếu của bất kỳ cửa hàng trực tuyến nào. Nó giúp người mua sắm hình dung ra sản phẩm mà họ muốn mua và cũng cung cấp cho họ thông tin quan trọng về sản phẩm, chẳng hạn như kích thước, màu sắc và kết cấu

WooC Commerce, nền tảng Thương mại điện tử phổ biến dành cho WordPress, cung cấp một cách tích hợp để lấy hình ảnh sản phẩm theo ID sản phẩm. Trong bài viết này, chúng tôi sẽ hướng dẫn bạn cách lấy hình ảnh sản phẩm theo ID sản phẩm trong WooC Commerce

Khi bạn xem một sản phẩm trong WooC Commerce, bạn sẽ nhận thấy rằng hình ảnh được hiển thị ở bên trái màn hình. Hình ảnh thường có thể nhấp và phóng to khi di chuột qua. Nếu bạn nhấp vào hình ảnh, bạn sẽ được đưa đến trang có thêm thông tin về sản phẩm

Tính năng ID sản phẩm phụ của hình ảnh sản phẩm WooC Commerce cho phép bạn lấy URL của bất kỳ hình ảnh sản phẩm nào mà không cần phải mở trang sản phẩm. Điều này có thể rất hữu ích nếu bạn cần hiển thị hình ảnh sản phẩm trên một trang web hoặc bài đăng blog khác

Để bắt đầu, chỉ cần truy cập WooC Commerce > Cài đặt > Sản phẩm. Từ đây, chọn tab Hiển thị và sau đó chọn hộp kiểm Kích hoạt hình ảnh sản phẩm theo ID sản phẩm. Khi bạn đã bật tính năng này, tất cả những gì bạn cần làm là thêm ?image_id=x vào bất kỳ URL sản phẩm WooC Commerce nào trong đó x là id của hình ảnh bạn muốn hiển thị

Ví dụ

Nếu URL cửa hàng WooC Commerce của bạn là

https. //ví dụ. com/cửa hàng/

Và bạn muốn hiển thị hình ảnh thứ hai của sản phẩm này

MẸO CHUYÊN NGHIỆP. Nếu bạn đang sử dụng WooC Commerce để bán sản phẩm trực tuyến, điều quan trọng là có thể lấy hình ảnh sản phẩm theo ID sản phẩm. Tuy nhiên, điều này có thể phức tạp vì có nhiều cách khác nhau để lấy hình ảnh sản phẩm trong WooC Commerce

Một cách để lấy hình ảnh sản phẩm trong WooC Commerce là sử dụng mã ngắn [wooc Commerce_product_image]. Mã ngắn này sẽ trả về hình ảnh sản phẩm cho sản phẩm được chỉ định bởi thuộc tính id

Tuy nhiên, phương pháp này chỉ hoạt động nếu bạn đang sử dụng permalinks mặc định của WordPress. Nếu bạn đang sử dụng cấu trúc permalink tùy chỉnh, bạn sẽ cần sử dụng mã ngắn [woocommerce_product_image id=””]

Một cách khác để lấy hình ảnh sản phẩm trong WooC Commerce là sử dụng mã ngắn [wooc Commerce_thumbnail]. Mã ngắn này sẽ trả về hình ảnh sản phẩm cho sản phẩm được chỉ định bởi thuộc tính id

Tuy nhiên, phương pháp này chỉ hoạt động nếu bạn đã đặt cài đặt kích thước hình thu nhỏ WooC Commerce của mình để khớp với cài đặt kích thước hình thu nhỏ WordPress của bạn. Nếu cài đặt hình thu nhỏ WooC Commerce của bạn không khớp với cài đặt hình thu nhỏ WordPress của bạn, bạn sẽ cần sử dụng mã ngắn [woocommerce_thumbnail id=””]

Cuối cùng, bạn

https. //ví dụ. com/cửa hàng/sản phẩm của tôi/

Bạn sẽ thêm phần này vào cuối URL của mình

https. //ví dụ. com/shop/my-product/?image_id=2

.

(Điều này sẽ chỉ hiển thị hình ảnh thứ hai được liên kết với sản phẩm này)

.

Phần kết luận

.

Tính năng Hình ảnh sản phẩm WooC Commerce theo ID sản phẩm là một cách tuyệt vời để hiển thị hình ảnh trên trang web của bạn mà không phải mở từng trang sản phẩm riêng lẻ. Chỉ cần thêm ?image_id=x vào bất kỳ URL sản phẩm WooC Commerce nào trong đó x bằng với số id của hình ảnh bạn muốn hiển thị

.

8 câu trả lời câu hỏi liên quan được tìm thấy

Làm cách nào để tôi có được danh mục sản phẩm bằng ID sản phẩm trong WooC Commerce?

Trong WooC Commerce, danh mục sản phẩm là một trong những nguyên tắc phân loại mặc định được sử dụng để sắp xếp sản phẩm. Theo mặc định, các sản phẩm được hiển thị trong trang cửa hàng theo danh mục của chúng. Bạn cũng có thể sử dụng danh mục sản phẩm để tạo màn hình sản phẩm tùy chỉnh của riêng mình và bán sản phẩm của bạn hiệu quả hơn

Làm cách nào để sử dụng ID sản phẩm trong WooC Commerce?

ID sản phẩm là một trong những phần dữ liệu quan trọng nhất trong WooC Commerce. Nó được sử dụng để xác định các sản phẩm trong cơ sở dữ liệu và nó được sử dụng bởi nhiều tính năng và tiện ích mở rộng của WooC Commerce. Bạn có thể tìm thấy ID sản phẩm trong màn hình chỉnh sửa sản phẩm, trong URL của sản phẩm và trong mã nguồn của trang sản phẩm

Làm cách nào để lấy tên danh mục theo ID sản phẩm trong WooC Commerce?

Nếu bạn đang điều hành một cửa hàng WooC Commerce, bạn có thể tìm ID sản phẩm của mình ở một vài nơi khác nhau. ID sản phẩm là một số duy nhất được chỉ định cho từng sản phẩm trong cửa hàng của bạn và được sử dụng để xác định sản phẩm trong cơ sở dữ liệu của bạn. Dưới đây là một vài nơi bạn có thể tìm thấy ID sản phẩm trong WooC Commerce. 1

Làm cách nào để có được hình ảnh bộ sưu tập sản phẩm trong WooC Commerce theo chương trình?

Chuyển đến bảng điều khiển quản trị, WooC Commerce > Cài đặt > Sản phẩm. Để đặt hình ảnh mặc định WooC Commerce theo chương trình, hãy sử dụng đoạn mã được đề cập bên dưới. .
Chuyển đến thư viện Phương tiện
Tìm kiếm hình ảnh
Sao chép đường dẫn URL
Dán mã được đề cập ở trên và giữ nguyên định dạng

Kích thước của hình thu nhỏ WooC Commerce là gì?

Kích thước hình thu nhỏ WooC Commerce được đặt thành chiều rộng 600 pixel theo mặc định . Tuy nhiên, chủ cửa hàng có thể tùy chỉnh tùy theo nhu cầu sử dụng. Tương tự, kích thước hình thu nhỏ của thư viện được đặt thành 100 pixel x 100 pixel theo mặc định.