Cách thêm trường meta tùy chỉnh trong WordPress mà không cần plugin

2. Gần góc trên bên phải của cửa sổ, nhấp vào nút "Tùy chọn màn hình". Trong hình ảnh của tôi, tôi đã dán nhãn này, “A. ”

3. Chọn hộp đã xuất hiện có nhãn, "Trường tùy chỉnh. ” Trong hình ảnh của tôi, tôi đã dán nhãn này, “B. ”

4. Đó là nó. Các trường tùy chỉnh của bạn sẽ xuất hiện ở cuối màn hình, hãy cuộn xuống nếu bạn không nhìn thấy nó

Một vấn đề cụ thể mà tôi gặp phải là sử dụng S2Member Pro, đây là một plugin tuyệt vời cho phép các tùy chọn thành viên tùy chỉnh và vai trò của người đăng ký. Tôi đã thiết lập để hoạt động với Authorize. net để thanh toán và để chấp nhận thanh toán trên trang web, bạn phải có chứng chỉ SSL. Vậy làm cách nào để buộc xác thực SSL?

Với các trường tùy chỉnh. Hướng dẫn ngắn s2Member cung cấp cho bạn chỉ cần nhập một trường s2member_force_ssl = yes

Vì vậy, làm thế nào để chúng tôi làm điều đó? . Bạn đi xuống phần trường tùy chỉnh, nhấp vào “Nhập mới” bên dưới hộp thả xuống cho ‘Tên’ và nhập “s2member_force_ssl".

Đối với Giá trị, bạn chỉ cần đặt, “có”

Sau đó, bạn lưu các thay đổi của mình và bạn đã sẵn sàng để bắt đầu. Tất nhiên, xin lưu ý rằng bạn phải thiết lập chứng chỉ SSL hợp lệ cho trang web để điều này hoạt động. Hy vọng rằng điều này sẽ giúp bạn trong hành trình trang web của bạn

Thông thường, người dùng có xu hướng tạo các trường tùy chỉnh WordPress bằng các plugin như Trường tùy chỉnh nâng cao, Nhóm, Bộ công cụ, v.v. Do đó, trong bài đăng này, tôi sẽ chỉ cho bạn cách tạo các trường tùy chỉnh trong WordPress mà không cần plugin. Nếu bạn là người hoàn toàn mới bắt đầu, thì hãy xem video bên dưới vì trong đó, tôi sẽ hiển thị tất cả những điều này một cách trực quan

Mục lục

Băng hình. Làm cách nào để tạo các trường tùy chỉnh trong WordPress mà không cần plugin?

Làm cách nào để tạo các trường tùy chỉnh trong WordPress mà không cần plugin?

Thực sự có một cách thực sự đơn giản để làm điều đó. Chỉ cần truy cập Trang web kỹ năng WP và mở Trình tạo hộp meta WordPress. Xem tại đây

Tiếp theo, điền vào tất cả các trường cần thiết và chọn loại bài đăng bạn cần tạo trường tùy chỉnh của mình. Bây giờ hãy nhấp vào biểu tượng dấu cộng (+) và thêm các trường của bạn. Tuy nhiên, hãy chú ý rằng bạn cần thêm Nhãn/Tên và ID, nếu không nó sẽ không hoạt động

Nếu tất cả các trường được thêm vào, hãy nhấp vào nút Sao chép bên dưới (xem ảnh chụp màn hình)

Bây giờ, hãy truy cập trang web của bạn và sử dụng plugin Code Snippets (hoặc các chức năng của chủ đề con của bạn. php) dán mã và kích hoạt nó

Nếu điều này được thực hiện, bạn có thể tự vỗ lưng mình vì bạn vừa thêm các trường tùy chỉnh trong WordPress mà không cần plugin. Để xác minh, hãy mở một bài đăng và xem liệu các trường có ở đó không

Làm cách nào để hiển thị các trường tùy chỉnh WordPress trên giao diện người dùng?

Mặc dù chúng tôi đã thêm các trường tùy chỉnh của mình, nhưng chúng tôi cần xuất chúng ở giao diện người dùng. Do đó, tôi sẽ chỉ cho bạn ba cách để làm điều đó

Hiển thị các trường tùy chỉnh với đoạn mã

Lấy mã ở đây bên dưới và dán mã vào hộp mã Đoạn mã và điều này sẽ thêm các trường của bạn vào phần tóm tắt trang sản phẩm duy nhất của Wooc Commerce

Nếu bạn đang sử dụng bất kỳ loại bài đăng nào khác thì để thêm nó vào đúng vị trí, bạn cần biết chủ đề của bạn đang sử dụng hook nào. Nếu bạn biết điều đó thì hãy thay đổi phần ‘woocommerce_single_product_summary’ trên dòng 2 cho phù hợp

Ngoài ra, trong ví dụ dưới đây, tôi đang trình bày cách xuất tất cả các loại trường, nghĩa là

• Chữ
• hộp kiểm
• Đài
• vùng văn bản
• Lựa chọn thả xuống
• Con số
• Điện thoại
• Ngày tháng
• URL

Nhiệm vụ của bạn là xóa những cái bạn không sử dụng và thay thế chúng bằng các trường của riêng bạn

NB. Bạn cần thay đổi nhãn ID_s cho phù hợp. Ví dụ. nếu ID trường của bạn là my_field thì hãy thay thế $some_number bằng $my_field . my_field (see the comments inside the code).

// Display custom fields in Woocommerce single product page
add_action( 'woocommerce_single_product_summary', 'wpsh_single_posts_custom_meta_fields', 10 );
function wpsh_single_posts_custom_meta_fields(){
  	$post_id = get_the_ID();
	$post   = get_post( $post_id );
	// Replace $some_number and some_number with your own field ID-s
	// For example: if your field ID is my_field, then replace $some_number with $my_field and some_number with my_field
	
	$some_text = get_post_meta( $post->ID, 'some_text' ); // Text field
	$some_textarea = get_post_meta( $post->ID, 'some_textarea' ); // Textarea field
	$some_checkbox = get_post_meta( $post->ID, 'some_checkbox' ); // Checkbox field
	$some_radio = get_post_meta( $post->ID, 'some_radio' ); // Radio field
	$some_select = get_post_meta( $post->ID, 'some_select' ); // Dropdown selection field
	$some_number = get_post_meta( $post->ID, 'some_number' ); // Number field
	$some_phone = get_post_meta( $post->ID, 'some_phone' ); // Phone field
	$some_date = get_post_meta( $post->ID, 'some_date' ); // Date field
	$some_url = get_post_meta( $post->ID, 'some_url' ); // URL field

	// Replace $some_number and some_number with your own field ID-s. NB! Don’t remove [0]. 
	// For example: fi your field ID is my_field, then replace $some_number with $my_field and $some_number[0] with $my_field[0]

	if(!empty($some_number) || !empty($some_radio) || !empty($some_checkbox)) {
		echo '
';
			// Text field
		if(!empty($some_text)){
			echo '
' . $some_text[0] . '
'; 
		}
			// Textarea field
		if(!empty($some_textarea)){
			echo '
' . $some_textarea[0] . '
'; 
		}
			// Checkbox field
		if($some_checkbox[0] == 1){
			echo '
 Free shipping 
';
		} 
			// Radio field
		if(!empty($some_radio)){
			echo '
' . $some_radio[0] . '
'; 
		}
			// Select field
		if(!empty($some_select)){
			echo '
' . $some_select[0] . '
'; 
		}
		// Number field
		if(!empty($some_number)){
			echo '
' . $some_number[0] . '
'; 
		}
		// Phone field
		if(!empty($some_phone)){
			echo '
' . $some_phone[0] . '
'; 
		}
		// Date field
		if(!empty($some_date)){
			echo '
' . $some_date[0] . '
'; 
		}
		// URL field
		if(!empty($some_url)){
			echo '
' . $some_url[0] . '
'; 
		}
	echo '
';
	}
}

Nếu bạn muốn hiển thị các trường tùy chỉnh của mình trên các trang lưu trữ, thì hãy sử dụng mã này ở đây bên dưới và, như trước đây, hãy thay đổi

• vị trí hook trên dòng 2 ‘woocommerce_shop_loop_item_title’
• lĩnh vực
• ID nhãn

// Display custom fields in Woocommerce archive pages
add_action( 'woocommerce_shop_loop_item_title', 'wpsh_archive_custom_meta_fields', 10 );
function wpsh_archive_custom_meta_fields(){
  	$post_id = get_the_ID();
	$post   = get_post( $post_id );
	// Replace $some_number and some_number with your own field ID-s
	// For example: if your field ID is my_field, then replace $some_number with $my_field and some_number with my_field
	
	$some_number = get_post_meta( $post->ID, 'some_number' ); // Number field
	$some_radio = get_post_meta( $post->ID, 'some_radio' ); // Radio field
	$some_checkbox = get_post_meta( $post->ID, 'some_checkbox' ); // Checkbox field
	
	// Replace $some_number and some_number with your own field ID-s. NB! Don’t remove [0]. 
	// For example: fi your field ID is my_field, then replace $some_number with $my_field and $some_number[0] with $my_field[0]

	// Number field
	if(!empty($some_number)){
   		echo $some_number[0]; 
	}
	
	// Radio field
	if(!empty($some_radio)){
   		echo '
' . $some_radio[0] . '
'; // radio field
	}
	
	 // Checkbox field
	if($some_checkbox[0] == 1){
   		echo '
 Free shipping 
';
	} 
}

Hiển thị các trường tùy chỉnh với Blocksy Pro Theme

Nếu giải pháp trước đây hơi quá kỹ thuật đối với bạn, thì có một phương pháp dễ dàng hơn một chút. Đó là – sử dụng Blocksy Pro Theme cho phép bạn xuất các nguyên tắc phân loại và trường tùy chỉnh trong kho lưu trữ và các trang bài đăng đơn lẻ mà không gặp bất kỳ rắc rối nào. Bạn có thể lấy nó ở đây (TIẾT KIỆM phiếu giảm giá 10% là WPSH10)

Hãy xem video ở trên để biết cách thực hiện ( xem 12. 30 điểm của video ).

Ngoài ra, hãy thêm bộ lọc này vào hộp mã Đoạn mã và thay thế

• các loại bài đăng trên dòng 5
• Nhãn ID-s (some_text, some_number, v.v.)
• Nhãn (Tên, Số, Tùy chọn của bạn, v.v. )

Xóa những cái bạn sẽ không sử dụng

add_filter(
	'blocksy:pro:post-types-extra:custom:collect-fields',
	function ($fields, $post_type) {
		
		$desired_post_type = ['post', 'product'];

		if (in_array($post_type, $desired_post_type)) {
			$fields = [
				'some_text' => __('Name', 'blocksy'),
				'some_number' => __('Number', 'blocksy'),
				'some_radio' => __('Your options', 'blocksy'),
				'some_select' => __('Your selection', 'blocksy')
			];
		}

		return $fields;
	},
	10, 2
);

Hiển thị các trường tùy chỉnh với plugin Kadence Blocks Pro

Plugin Kadence Blocks Pro cho phép bạn xuất nội dung động (các trường tùy chỉnh, v.v.) trong Gutenberg Blocks. Lấy Kadence Blocks Pro với chiết khấu 10% tại đây (sử dụng phiếu giảm giá 10% SIMPLEHACKS)

Xem video trên để biết cách sử dụng plugin (xem ở 16. 24 điểm)

Hiển thị các trường tùy chỉnh với kết hợp Blocksy Pro và Kadence Blocks Pro

Có lẽ cách dễ nhất để hiển thị các trường tùy chỉnh của bạn là nếu bạn sử dụng kết hợp Blocksy Pro và Kadence Blocks Pro

Với sự trợ giúp của Blocks, bạn có thể sử dụng nó để xuất các khối Gutenberg ở bất cứ đâu bạn cần. Và Kadence Blocks Pro cho phép bạn hiển thị nội dung động, đó là các trường tùy chỉnh. Xem video trên (xem ar 20. 40 điểm)

Mẹo WordPress hữu ích

• Cách ẩn Phương thức vận chuyển WooC Commerce (Có điều kiện) – Hướng dẫn đầy đủ

• Hơn 12 tiện ích mở rộng Chrome hữu ích dành cho nhà phát triển web

• Làm cách nào để thêm và sao chép vai trò người dùng trong WordPress?

• Làm cách nào để khôi phục các widget cổ điển của WordPress?

• Làm thế nào để tạo một trang web bất động sản với WordPress?

Mẹo hữu ích liên quan đến Blocksy

• Các tính năng ẩn của chủ đề Blocksy và các bản hack hữu ích

• Làm cách nào để tạo Nhiều Đầu trang, Chân trang & Thanh bên với chủ đề Blocksy?

• Làm cách nào để tạo tiêu đề trong suốt với chủ đề Blocksy?

• Làm cách nào để tạo tiêu đề dính với chủ đề Blocksy?

• Đánh giá đầy đủ chủ đề Blocksy Pro – Nó có tốt và đáng tiền của bạn không?

• Làm cách nào để tạo một menu lớn với chủ đề Blocksy?

• Làm cách nào để sử dụng Trình tạo tiêu đề Blocksy?

• Hướng dẫn chủ đề Blocksy – Cách thiết kế lại trang web của bạn dưới 45 phút

Dưới đây là một số công cụ Wordpress yêu thích của tôi

Cảm ơn bạn đã đọc bài viết này. Tôi hy vọng bạn thấy nó hữu ích khi bạn xây dựng trang web và trang web thương mại điện tử của riêng mình. Dưới đây là một số công cụ tôi sử dụng với tư cách là nhà phát triển và người đam mê Wordpress mà tôi hy vọng bạn cũng sẽ thấy hữu ích

Đây là các liên kết liên kết, vì vậy nếu bạn quyết định sử dụng bất kỳ liên kết nào trong số chúng, tôi sẽ kiếm được hoa hồng và điều này giúp tôi tạo các hướng dẫn này và tạo video Youtube. Nhưng thành thật mà nói, đây là những công cụ chính xác mà tôi sử dụng và giới thiệu cho mọi người, ngay cả bạn bè và gia đình của tôi

chủ đề. Trong vài năm qua, tôi có hai chủ đề mà tôi sử dụng cho mọi loại dự án. Hai theme đó là Blocksy theme và Kadence Theme. Trên trang web này và kênh Youtube của tôi, bạn sẽ thấy rất nhiều hướng dẫn tôi đã thực hiện về chúng. Nếu bạn muốn được giảm giá 10% cho cả hai thì

• sử dụng liên kết này cho Blocksy (phiếu giảm giá 10% là WPSH10)
• liên kết này cho Kadence (tiết kiệm phiếu giảm giá 10% là SIMPLEHACKS)

Trình quản lý đoạn mã. WPCodeBox cho phép bạn thêm các đoạn mã vào trang web của mình. Ngoài ra, nó cho phép bạn xây dựng và quản lý thư viện Đoạn mã WordPress của mình trên đám mây. Bạn có thể lấy nó với chiết khấu 20% tại đây ( TIẾT KIỆM 20% Phiếu giảm giá. WPSH20)

biểu mẫu liên hệ. Có hàng trăm biểu mẫu liên hệ ngoài kia nhưng Biểu mẫu thông thạo là biểu mẫu tôi thích nhất. Nếu bạn cần giảm giá 20% thì hãy sử dụng liên kết này (phiếu giảm giá 20% tiết kiệm là WPSH20)

Tiện ích bổ sung Gutenberg. Nếu tôi cần một tiện ích bổ sung khối Gutenberg tốt thì Kadence Blocks là tiện ích tôi đã sử dụng nhiều nhất. Bạn sẽ được giảm giá 10% với phiếu giảm giá SIMPLEHACKS tại đây

Di chuyển trang web. Trong khi xây dựng một trang web, bạn có thể cần một plugin tốt có thể giúp bạn di chuyển, sao lưu, khôi phục và dàn trang web. Chà, WpVivid là cái tôi đã sử dụng trong vài năm qua. Nếu bạn sử dụng liên kết này cùng với phiếu giảm giá WPSH20, bạn sẽ được giảm giá 20%

Tiện ích mở rộng thương mại điện tử. Có rất nhiều tiện ích mở rộng Wooc Commerce mà tôi thực sự thích nhưng tiện ích thực sự nổi bật là Advanced Dynamic Pricing. Một lần nữa, bạn sẽ được giảm giá 20% nếu sử dụng liên kết này tại đây (phiếu giảm giá 20% là WPSH20)

Web hosting. Nếu bạn muốn có một dịch vụ lưu trữ đám mây được quản lý thực sự nhanh chóng và dễ sử dụng, thì tôi khuyên dùng Verpex Hosting (xem bài đánh giá của tôi tại đây). Nhân tiện, trang web này được lưu trữ trong Verpex. )

Để xem tất cả các đề xuất cập nhật nhất của tôi, hãy xem tài nguyên này mà tôi đã tạo cho bạn

Bạn có muốn cảm ơn tôi và mời tôi một cốc bia không?

Mọi đóng góp đều được hoan nghênh nhưng KHÔNG BAO GIỜ được yêu cầu. Thưởng thức công việc của tôi miễn phí nhưng nếu bạn muốn cảm ơn tôi và mua cho tôi một hoặc hai ly bia thì bạn có thể sử dụng biểu mẫu này ở đây bên dưới