การสร้างรหัสย่อใน WordPress CMS รหัสย่อ การเพิ่มปุ่มแทรกรหัสย่อให้กับโปรแกรมแก้ไขโพสต์ภาพ TinyMCE
รหัสย่อ- นี่เป็นสิ่งที่มีประโยชน์มากสำหรับผู้ดูแลเว็บ รหัสย่อช่วยอำนวยความสะดวกในการทำงานประจำในการแทรกข้อมูลประเภทเดียวกันลงในเว็บไซต์หลายร้อยหน้า ในขณะเดียวกันก็สะดวกในการแทนที่ข้อมูลในรหัสย่อที่ต้องการอย่างมหาศาล
หากคุณยังไม่รู้ว่า Shortcode คืออะไร ฉันจะอธิบายสั้นๆ ลองนึกภาพว่าคุณต้องแทรกโค้ดลงในบทความ โดยปล่อยให้เป็นลิงก์:
10 รหัสย่อ WordPress ที่มีประโยชน์
สมมติว่าคุณต้องการแทรกลงใน 10 บทความในตำแหน่งที่ต้องการ โดยหลักการแล้ว ไม่ยากครับ ตั้งไว้เลย ทีนี้ลองจินตนาการว่าลิงก์เสียและคุณจำเป็นต้องแทนที่ใน 10 แห่งใช่ไหม แล้วถ้าเป็น 100 หน้าล่ะ? การทำเช่นนี้ด้วยตนเองจะเป็นเรื่องยาก เว้นแต่สำหรับหลาย ๆ คนนี่เป็นงานที่ยาก
ตอนนี้ลองจินตนาการว่าคุณมีปลั๊กอินที่คุณสามารถสร้างลิงก์สั้น ๆ สำหรับแต่ละโค้ดได้ เช่น ซึ่งสามารถแทรกลงในข้อความได้โดยตรงในโหมดตัวแก้ไข ซึ่งมักจะสะดวกกว่าในโหมด html มาก
ตอนนี้ หากคุณต้องการเปลี่ยนลิงก์ ให้ไปที่แผงผู้ดูแลระบบปลั๊กอินแล้วเปลี่ยนลิงก์ จากนั้นโค้ดจะเปลี่ยนโดยอัตโนมัติในทุกหน้าของไซต์ที่มีรหัสย่อของเรา สำหรับแต่ละลิงก์ แบนเนอร์ สคริปต์ หรือรูปภาพ คุณสามารถสร้างรหัสย่อของคุณเองและจัดการอาร์เรย์นี้ได้จากศูนย์ควบคุมแห่งเดียว
และหากคุณมีร้านค้าออนไลน์ นี่จะยิ่งมีประโยชน์มากขึ้นสำหรับคุณตั้งแต่ใช้งาน ด้วยรหัสย่อของ woocommerce คุณสามารถเปลี่ยนแปลงราคา อัตราแลกเปลี่ยน ชื่อผลิตภัณฑ์ และอื่นๆ จำนวนมากได้ ทั้งหมดนี้สามารถทำได้อย่างไร?
มีปลั๊กอินค่อนข้างน้อยสำหรับการสร้างรหัสย่อใน WordPress แต่ฉันไม่ชอบเลย: ทุกอย่างเป็นภาษาอังกฤษบางครั้งก็ดูหรูหราเกินไปบางครั้งก็ใช้งานไม่ได้เพียงพอ ... แต่เมื่อวันก่อนฉันอ่านว่า บล็อกเกอร์ SEO ที่มีชื่อเสียง วิทาลี เบอร์โกมิสทรอฟประกาศปลั๊กอินฟรีเพื่อวัตถุประสงค์เหล่านี้ - โค้ดโดย mojWP.
นี่คือวิดีโอสั้น ๆ ของการทำงานของปลั๊กอินนี้:
หากคุณแทรกโค้ดเทมเพลตรหัสย่อลงใน html คุณจะเห็นสิ่งที่คุณแทรก - รหัสย่อ เพื่อให้ใช้งานได้ คุณต้องใส่รหัสย่อไว้ในฟังก์ชัน:
ตอนนี้คุณจะเห็นสิ่งที่คุณซ่อนอยู่หลังรหัสย่อของคุณบนเว็บไซต์ ไม่มีอะไรซับซ้อนใช่ไหม? ในแผงผู้ดูแลระบบมีคำแนะนำเล็กน้อยสำหรับปลั๊กอินและวิดีโอที่ฉันแทรกลงในบทความ
ฉันอยากจะแสดงให้คุณเห็นว่าจะสามารถนำไปปฏิบัติได้อย่างไร ฉันอยากทำสิ่งนี้มานานแล้ว และตอนนี้ดูเหมือนว่าจะถึงเวลาแล้ว เพื่อให้เข้าใจแก่นแท้ของความคิดของฉัน ฉันจะสังเกตเพียงจุดเดียวเท่านั้น
Adsense สร้างรายได้จากอะไร?
1. ต้นทุนต่อผู้บริโภค
2. จำนวนคลิก
เราจะไม่สามารถมีอิทธิพลต่อบทความแรกได้อีกต่อไปหากบทความถูกเขียนขึ้นและมีการเข้าชมบทความที่ดีอยู่แล้ว แต่เราสามารถเพิ่มอัตราการคลิกผ่านและในเวลาเดียวกันได้อย่างมาก ตามที่คุณเข้าใจฉันจะพูดถึงเฉพาะบล็อคโฆษณาที่อยู่ในบทความเท่านั้น บล็อกในแถบด้านข้าง ในห้องใต้ดิน และยิ่งกว่านั้นในส่วนหัวนั้นโง่ที่สุด และฉันลบมันทั้งหมดไปนานแล้ว
แต่บทความนี้เป็นเรื่องที่แตกต่างไปจากเดิมอย่างสิ้นเชิง บุคคลหนึ่งเริ่มอ่านบทความและสะดุดกับโฆษณา เขาจะคลิกหรือไม่ ทุกอย่างขึ้นอยู่กับปัจจัยหนึ่ง: หัวข้อการโฆษณาเกิดขึ้นพร้อมกันกับปัญหาที่กำลังพูดคุยกันในขั้นตอนนี้ของบทความโดยสมบูรณ์ ตัวอย่าง:
นี่คือบุคคลที่กำลังอ่านว่าควรเลือกโฮสติ้งใด อ่าน อ่าน และตอบคำถามที่คุณเขียนในบทความและเน้นเป็นตัวหนา - โฮสติ้งที่ดีที่สุดในการเลือกคืออะไร?
อย่างไรก็ตาม ฉันได้ใช้ปลั๊กอินนี้แล้วและแทรกรหัสย่อที่มีโฆษณา Adsense หลังคำถามของฉัน - มันแสดงอะไรให้คุณเห็น หากคุณวางบล็อกโฆษณาไว้ที่อื่น เอฟเฟกต์นี้จะไม่เป็นเช่นนั้นอีกต่อไป คุณเข้าใจสิ่งที่ฉันได้รับหรือไม่?
ใช่ คุณต้องแทรกรหัสโฆษณาลงในตำแหน่งที่ถูกต้องด้วยตนเอง! หากไม่มีสถานที่นี้ คุณจะต้องสร้างมันขึ้นมา! คุณสามารถทำได้: เปิด google.com แล้วป้อนชื่อบทความของเราในการค้นหา เรากำลังมองหาบทความของเราในผลการค้นหาและไปที่บทความนั้น เราดูว่า Adsense แสดงอะไร เรากำลังมองหาสถานที่ในบทความที่จะเป็นสถานที่ที่เหมาะสม เราจบบทความโดยใช้คำจากโฆษณานี้ และใส่รหัสย่อที่นั่น
ตอนนี้โฆษณาในบทความจะเหมาะสมที่สุดสำหรับเนื้อหา อย่างน้อยก็ในส่วนของข้อความที่จะยืน ใช่มันยาวและน่าเบื่อ แต่เราไม่ได้มองหาวิธีง่าย ๆ ใช่ไหม? วิธีง่ายๆ คือศาสนาของคนขี้แพ้...
ไม่พบคำตอบใช่ไหม ใช้การค้นหาไซต์
รหัสย่อคือฟังก์ชัน PHP ที่สามารถใช้ภายในเนื้อหาโพสต์โดยใช้เงื่อนไข
ตัวอย่างเช่น รหัสย่อ WordPress มาตรฐานช่วยให้คุณสามารถแสดงแกลเลอรีภายในโพสต์ได้
เห็นได้ชัดว่าฟังก์ชันนี้ช่วยให้นักพัฒนา WordPress มีโอกาสที่น่าอัศจรรย์ - ในปัจจุบันการแทรกแบบฟอร์ม ปุ่ม แถบเลื่อนลงในโพสต์มีความเกี่ยวข้องมาก
เช่นเดียวกับฟังก์ชันที่สามารถมีข้อโต้แย้งได้ รหัสย่อสามารถมีพารามิเตอร์ของตัวเองได้ ตัวอย่างรหัสย่ออื่น:
คุณสามารถวางโค้ดลงในไฟล์ function.php ได้ (ฉันหมายถึงโค้ดที่อยู่ในไดเร็กทอรีธีมปัจจุบันของคุณ)
ชื่อของรหัสย่อจะต้องเป็นตัวพิมพ์เล็กและประกอบด้วยตัวอักษรละติน ตัวเลข และขีดล่างเท่านั้น
รหัสย่อพร้อมพารามิเตอร์
โอเค ฉันเขียนไปแล้วว่ารหัสย่อสามารถมีพารามิเตอร์ของตัวเองได้ มาดูกันว่ามันทำอย่างไร
ตามตัวอย่าง ฉันเขียนรหัสย่อที่แทรกลิงก์ลงในโพสต์ที่เปิดในแท็บเบราว์เซอร์ใหม่ target="_blank" ฉันไม่คิดว่ามันมีประโยชน์จริง ๆ แต่สำหรับเราตอนนี้สิ่งสำคัญคือการเข้าใจหลักการทำงานของรหัสย่อ
จะมีพารามิเตอร์สองตัว: Anchor และ url - Anchor (ข้อความลิงก์) และ URL ตามลำดับ หากไม่ได้ระบุพารามิเตอร์ในรหัสย่อก็จะใช้ค่าเริ่มต้นที่ตั้งไว้ในฟังก์ชัน
การปิดรหัสย่อและรหัสย่อภายในรหัสย่อ
ลองใช้รหัสย่อจากตัวอย่างที่แล้วและปรับแต่งเล็กน้อย ฉันขอเตือนคุณว่ารหัสย่อมีลักษณะดังนี้:
.
จะเป็นอย่างไรถ้าเราสร้างใหม่เช่นนี้: URL ลิงก์
นอกจากนี้ คุณสามารถแทรกรหัสย่ออื่น ๆ ไว้ในรหัสย่อปิดได้ (ด้วยฟังก์ชัน)
ดังนั้น เรามาเขียนโค้ดของเราใหม่จากตัวอย่างก่อนหน้านี้:
| ฟังก์ชั่น true_url_external( $atts , $shortcode_content = null ) ( $params = shortcode_atts( array ( "anchor" => "Misha Rudrastykh" ) , $atts ) ; return """ target="_blank">($params[ "สมอ "])"; ) add_shortcode( "trueurl" , "true_url_external" ) ; |
ตอนนี้รหัสย่อประเภทต่อไปนี้จะแสดงลิงก์ไปยังหน้าหลักของเว็บไซต์ของคุณ (ฉันเขียนเกี่ยวกับรหัสย่อด้านบน)
การเพิ่มปุ่มแทรกรหัสย่อลงใน TinyMCE Visual Post Editor
เป็นที่ชัดเจนว่าการแทรกรหัสย่อผ่านโปรแกรมแก้ไข TinyMCE ในตัวจะสะดวกกว่ามากและหากมีการใช้อินเทอร์เฟซที่ให้คุณตั้งค่าพารามิเตอร์รหัสสั้นได้โดยทั่วไปก็จะเจ๋ง
1. PHP
ไม่ว่าปุ่มของคุณจะเป็นข้อความหรือไอคอน ไม่ว่าจะมีช่องอินพุตเพิ่มเติม (พารามิเตอร์รหัสย่อ) หรือไม่ ในทุกกรณี โค้ด PHP การลงทะเบียนปุ่มจะเหมือนกัน
| // ฟังก์ชั่น Hooks true_add_mce_button() ( // ตรวจสอบสิทธิ์ของผู้ใช้ - เขาสามารถแก้ไขโพสต์และเพจได้หรือไม่ถ้า ( !current_user_can( "edit_posts" ) && !current_user_can( "edit_pages" ) ) ( return ; // หากไม่สามารถทำได้ ก็ไม่จำเป็นต้องใช้ปุ่มเช่นกัน ในกรณีนี้ ออกจากฟังก์ชัน } // ตรวจสอบว่าผู้ใช้เปิดใช้งานโปรแกรมแก้ไขภาพในการตั้งค่าหรือไม่ (หากไม่เช่นนั้นก็ไม่จำเป็นต้องเชื่อมต่อปุ่ม) if ("true" == get_user_option ("rich_editing")) (Add_filter ("MCE_EXTERNAL_PLUGIGESS", "True_add_TINYMCE_SCRIPT"); Add_Filter ("MCe_buttons", "True_Rregister CE_BUTTON);)) Add_action ("admin_head", "true_add_mce_button"); // ในฟังก์ชันนี้ เราระบุลิงก์ไปยังไฟล์ JavaScript ของปุ่มฟังก์ชั่น true_add_tinymce_script( $plugin_array ) ( $plugin_array [ "true_mce_button" ] = get_stylesheet_directory_uri() . "/true_button.js" ; return $plugin_array ; ) // ลงทะเบียนปุ่มในตัวแก้ไขฟังก์ชั่น true_register_mce_button( $buttons ) ( array_push ( $buttons , "true_mce_button" ) ; // true_mce_button - ตัวระบุปุ่มกลับ $ ปุ่ม; ) |
ในตัวอย่างนี้ ฉันใช้ . true_button.js - ปุ่มนั้นสร้างไฟล์นี้ในไดเร็กทอรีธีม (หรือที่ใดก็ได้ที่คุณต้องการ แต่อย่าลืมเปลี่ยนพา ธ ในกรณีนี้)
2.1. จาวาสคริปต์ ตัวอย่างปุ่มง่ายๆ
มาดูเนื้อหาของไฟล์ true_button.js กันดีกว่า เริ่มต้นด้วยการสร้างปุ่มง่ายๆ ที่จะแทรกรหัสย่อ
| (ฟังก์ชั่น () ( Tinymce.PluginManager .add ("true_mce_button" , ฟังก์ชั่น ( ตัวแก้ไข, url ) ( // true_mce_button - รหัสปุ่ม editor.addButton("true_mce_button" , ( // true_mce_button - ID ปุ่มจะต้องเหมือนกันทุกที่ข้อความ: "" , // ข้อความของปุ่ม หากคุณต้องการให้ปุ่มของคุณมีเพียงไอคอน ให้ลบบรรทัดนี้ออกชื่อ: "ใส่รหัสย่อ", //คำแนะนำเครื่องมือไอคอน: เท็จ // ที่นี่คุณสามารถระบุไอคอนเวกเตอร์ที่มีอยู่ใน TinyMCE หรือคลาส CSS ของคุณเองได้ onclick: ฟังก์ชั่น () ( editor.insertContent("" ) ; // วางรหัสย่อลงในโปรแกรมแก้ไข คุณยังสามารถตั้งค่าการทำงานของ jQuery ได้อีกด้วย } } ) ; } ) ; } ) () ; |
ผลที่ตามมา:
เวอร์ชันข้อความของปุ่มแทรกรหัสย่อในโปรแกรมแก้ไขภาพ TinyMCE
2.2. ปุ่มพร้อมไอคอนรายการแบบเลื่อนลงและความสามารถในการตั้งค่าพารามิเตอร์รหัสย่อ
ฉันจะเริ่มต้นด้วยการแทรก (หรือแทนที่) รหัสในไฟล์ true_button.js:
| (ฟังก์ชั่น () ( Tinymce.PluginManager.add("true_mce_button" , ฟังก์ชั่น ( ตัวแก้ไข, url ) ( // ปุ่ม id true_mce_button จะต้องเหมือนกันทุกที่ editor.addButton( "true_mce_button" , ( // ปุ่ม id true_mce_buttonไอคอน: "เปเรค" , // คลาส CSS ของฉันเองซึ่งฉันจะตั้งค่าไอคอนของปุ่มประเภท: "ปุ่มเมนู" , หัวเรื่อง: "แทรกองค์ประกอบ", // วางคำแนะนำเครื่องมือเมนู: [ // รายการแบบเลื่อนลงรายการแรกเริ่มต้นที่นี่( ข้อความ: "องค์ประกอบแบบฟอร์ม" เมนู: [ // นี่คือจุดเริ่มต้นของดรอปดาวน์อันที่สองภายในอันแรก( ข้อความ: "ฟิลด์ข้อความ" , onclick: ฟังก์ชั่น () ( editor.windowManager.open( ( ชื่อ: "ตั้งค่าตัวเลือกฟิลด์", เนื้อความ: [ ( ประเภท: "กล่องข้อความ" , ชื่อ: "ชื่อกล่องข้อความ" , // ID จะถูกใช้ด้านล่างฉลาก: "รหัสและชื่อของช่องข้อความ", // ค่าป้ายกำกับ: "ความคิดเห็น" // ค่าเริ่มต้น) , ( พิมพ์: "กล่องข้อความ" , // ประเภทกล่องข้อความ = กล่องข้อความชื่อ: "multilineName" , ป้ายกำกับ: "ค่าเริ่มต้นของช่องข้อความ", ค่า: "สวัสดี" , หลายบรรทัด: จริง , // ช่องข้อความขนาดใหญ่ - พื้นที่ข้อความขั้นต่ำกว้าง: 300 // ความกว้างขั้นต่ำเป็นพิกเซลความสูงขั้นต่ำ: 100 // ความสูงขั้นต่ำเป็นพิกเซล) , ( พิมพ์: "กล่องรายการ" , // พิมพ์กล่องรายการ = เลือกรายการแบบเลื่อนลงชื่อ: "listboxName" , ป้ายกำกับ: "Fill" , "values" : [ // ค่ารายการแบบเลื่อนลง( ข้อความ: "จำเป็น" , ค่า: "1" ) , // ป้ายกำกับ, ค่า(ข้อความ: "ไม่จำเป็น", ค่า: "2" ) ] ) ] , onsubmit: ฟังก์ชั่น ( e ) ( // สิ่งนี้จะเกิดขึ้นหลังจากกรอกข้อมูลในช่องแล้วกดปุ่มส่ง editor.insertContent( "" ) ; ) ) ) ; ) ) , ( // องค์ประกอบที่สองของรายการแบบเลื่อนลงที่ซ้อนกัน เพียงแทรกรหัสย่อข้อความ: “ปุ่มส่ง”, onclick: ฟังก์ชั่น () ( editor.insertContent("" ) ; ) ) ] ) , ( // องค์ประกอบที่สองของรายการดรอปดาวน์แรก เพียงแทรกข้อความ: "รหัสย่อ " , onclick: function () ( editor.insertContent("" ) ; ) ) ] ) ) ; ) ) ; ) ) () ; |
หลังจากวางโค้ดแล้ว ปุ่มของฉันก็อยู่ที่นั่นและใช้งานได้แล้ว สิ่งเดียวคือไม่มีไอคอนใด ๆ (ยกเว้นลูกศรลง)
WordPress เป็นระบบการเผยแพร่ที่ทรงพลังซึ่งสะดวกพอ ๆ กันสำหรับบล็อกเกอร์มือใหม่ เช่นเดียวกับการสร้างฟอรัม โซเชียลเน็ตเวิร์ก ร้านค้า ฯลฯ
โดยปกติแล้วจะมีการเลือกเทมเพลต (เทมเพลต) ที่เหมาะสมสำหรับแต่ละแอปพลิเคชัน แต่บางครั้งความสามารถของมันก็ไม่เพียงพอ
นี่คือจุดที่รหัสย่อมาช่วยเหลือด้วยความช่วยเหลือซึ่งคุณสามารถเพิ่ม "ความสนุก" ของคุณเองลงใน WordPress
รหัสย่อคือรหัสสั้นที่แทรกโดยตรงลงในข้อความของหน้า ส่วนหัว วิดเจ็ต - นั่นคือในเนื้อหาและขยายขีดความสามารถของ WordPress
ด้วยเครื่องมือนี้ คุณสามารถจัดรูปแบบข้อความได้อย่างสวยงาม แบ่งเป็นคอลัมน์ แทรกเนื้อหา ปุ่ม เครื่องเล่นเสียง แบบฟอร์มคำสั่งซื้อ และฟีเจอร์อื่น ๆ อีกมากมายที่ทำให้ WordPress ของคุณแตกต่างจากผู้อื่น
หากไม่มีตัวจัดการสำหรับรหัสย่อเฉพาะ การเรียกบนเพจจะมีลักษณะเป็นข้อความธรรมดา
บทความนี้จงใจใช้ชื่อของรหัสย่อที่ไม่มีอยู่จริง เพื่อให้คุณเห็นว่าการเรียกรหัสสั้นนั้นมีลักษณะอย่างไร ไม่ใช่ผลลัพธ์ของการทำงาน
ประเภทรหัสย่อตามโครงสร้าง
พวกเขาสามารถอยู่ได้โดยไม่มีพารามิเตอร์ โดยมีพารามิเตอร์และมีเนื้อหา
รหัสย่อที่ไม่มีพารามิเตอร์
บางครั้งการเรียกรหัสย่อก็เพียงพอแล้วสำหรับการเรียกใช้ฟังก์ชันที่กำหนดไว้อย่างดี ไม่จำเป็นต้องผ่านพารามิเตอร์ใดๆ
ตัวอย่างเช่น รหัสนี้แสดงเส้นแนวนอน ลักษณะที่ปรากฏถูกกำหนดไว้ในสไตล์ชีต
การโทรนี้จะพิมพ์ปีปัจจุบัน สะดวกไม่ต้องแก้ไขข้อความทุกปี
รหัสย่อพร้อมพารามิเตอร์
บางครั้งคุณต้องส่งพารามิเตอร์เพื่อให้ได้ผลลัพธ์ที่แตกต่าง
ตัวอย่างเช่น นี่คือวิธีการแทรกปุ่มที่สวยงาม สไตล์ที่ควรเขียนลงในสไตล์ชีต
ประกอบด้วยพารามิเตอร์สองตัว: ชื่อ- นี่คือคำจารึกบนปุ่ม เช่น สั่งซื้อ สมัครสมาชิก ฯลฯ
URLคือที่อยู่การคลิกผ่าน
นี่คือวิธีที่คุณสามารถแทรกราคาเป็นรูเบิล ซึ่งจะแปลงจากราคาเป็นดอลลาร์ตามอัตราแลกเปลี่ยนปัจจุบันของธนาคารกลางโดยอัตโนมัติ
นี่คือพารามิเตอร์ สคือราคาเป็นดอลลาร์
รหัสย่อของเนื้อหา
ประกอบด้วยสองส่วน โดยระหว่างนั้นอาจมีเนื้อหาโพสต์ วิดเจ็ต ฯลฯ
นี่คือวิธีที่คุณสามารถเน้นข้อความหรือบางส่วนของโพสต์โดย "วาง" พื้นหลังสีไว้ข้างใต้:
นี่คือข้อความบางส่วนที่จะแสดงบนพื้นหลังสี
พารามิเตอร์ สีตั้งค่าสีพื้นหลังในรหัสฐานสิบหกตามปกติ
ต่อไปนี้คือวิธีที่คุณสามารถแสดงข้อความในสองคอลัมน์ที่มีความกว้างเท่ากัน:
รหัสย่อในโค้ด php ประกอบด้วยฟังก์ชันที่ประมวลผลและคำสั่งที่กำหนดฟังก์ชันที่เกี่ยวข้องให้กับโค้ด
นี่คือรหัสย่อทั่วไปสำหรับปุ่ม:
การทำงาน ฮ่า_แต่($atts,$content=NULL) (
แยก (shortcode_atts (อาร์เรย์ (
'ชื่อ' => 'ไป',
'url' => เท็จ
), $แอตต์));
$เอาท์พุต=" '.$ชื่อ'’;
ส่งคืน $ เอาต์พุต;
}
add_shortcode('แต่','ha_but');
ในตัวอย่างนี้ ฟังก์ชันมีชื่อว่า ฮ่า_แต่. มันถูกส่งผ่านสองพารามิเตอร์ - ชื่อและ URL. และสำหรับ ชื่อค่าเริ่มต้นที่กำหนด ไป. หากเมื่อเรียกรหัสพารามิเตอร์ ชื่อข้าม จากนั้นปุ่มเริ่มต้นจะมีป้ายกำกับ ไป.
ภายในฟังก์ชั่นสามารถเรียกใช้ฟังก์ชั่นอื่นๆ, เชื่อมต่อไฟล์ได้ ฯลฯ ฟังก์ชั่น Shortcode ถูกจำกัดด้วยจินตนาการและทักษะการเขียนโปรแกรมของคุณเท่านั้น
ฟังก์ชันจะส่งกลับผลลัพธ์ด้วย กลับ.
การทำงาน add_shortcodeกำหนดให้กับรหัสย่อตามชื่อ แต่ฟังก์ชันตัวจัดการตามชื่อ ฮ่า_แต่.
และนี่คือสไตล์สำหรับปุ่มสีเหลืองแบบเต็มความกว้าง:
บาท(
จอแสดงผล: อินไลน์บล็อก
สี: #000000;
แบบอักษร: 300 16px "Roboto", sans-serif;
การแปลงข้อความ: ตัวพิมพ์ใหญ่;
พื้นหลัง: #fde42b;
พื้นหลัง: -webkit-gradient(เชิงเส้น, บนซ้าย, ล่างซ้าย, จาก (#fcea38), ถึง (#ffcf00));
พื้นหลัง: -webkit-linear-gradient (ด้านบน, #fcea38 0%, #ffcf00 100%);
พื้นหลัง: การไล่ระดับสีเชิงเส้น (ไปด้านล่าง, #fsea38 0%, #ffcf00 100%);
ขอบล่าง: 3px solid #b27d00;
การขยาย: 14px 15px 11px;
ความกว้าง: 90%
รัศมีเส้นขอบ: 2px
การจัดแนวข้อความ: กึ่งกลาง;
การตกแต่งข้อความ: ไม่มี;
ข้อความเงา: 1px 1px 0 #ffec89;
}
.btn:โฮเวอร์ (
ความทึบ: 1
พื้นหลัง: -webkit-gradient(เชิงเส้น, ล่างซ้าย, ซ้ายบน, จาก (#ffdd02), ถึง (#fffe6d));
พื้นหลัง: -webkit-linear-gradient (ด้านล่าง, #ffdd02 0%, #fffe6d 100%);
พื้นหลัง: การไล่ระดับสีเชิงเส้น (ไปด้านบน, #ffdd02 0%, #fffe6d 100%);
ขอบสี: #bd8500;
วิธีแทรกรหัสย่อในเทมเพลต WordPress
แทรกฟังก์ชัน - ตัวจัดการรหัสย่อสามารถโดยตรงลงในไฟล์ที่รับผิดชอบในการแสดงโพสต์เดียว - โดยปกติจะเป็นเช่นนี้ single.php. รหัสย่อนี้จะใช้ได้เฉพาะในโพสต์เท่านั้น
เอาไปใส่ในไฟล์เลยดีกว่า functions.phpพบได้ในธีม WordPress ใด ๆ จากนั้นรหัสย่อจะใช้ได้กับทุกหน้า วิดเจ็ต ฯลฯ
อย่างไรก็ตาม หากคุณอัปเดตหรือเปลี่ยนแปลงเทมเพลต รหัสย่อจะไม่ได้รับการประมวลผลอีกต่อไป หากคุณวางแผนที่จะเปลี่ยนการออกแบบบล็อกในอนาคต ควรวางโค้ดของรหัสย่อทั้งหมดไว้ในไฟล์เดียวจะดีกว่า เช่น รหัสย่อ.php,และวางไว้ในโฟลเดอร์ ของฉันที่รากของไซต์
ในกรณีนี้คุณต้องจัดระเบียบการโทรโดยแทรกลงในไฟล์ functions.phpสั่งการ need_once('ของฉัน/shortcodes.php');
หลังจากเปลี่ยนหรืออัปเดตธีม WordPress แล้ว อย่าลืมลงทะเบียนคำสั่งนี้อีกครั้ง
วิธีแทรกรหัสสั้นลงในหน้า WordPress
เพื่อให้รหัสย่อทำงานได้ คุณต้องแทรกการเรียกของมันในตำแหน่งที่ถูกต้องในเนื้อหา ซึ่งประกอบด้วยวงเล็บเหลี่ยม ชื่อของรหัสย่อ และพารามิเตอร์ ในเวลาเดียวกันคุณสามารถตกแต่งด้วยสไตล์ใดก็ได้เหมือนกับข้อความปกติของโพสต์
ฉันหวังว่าจะมีตัวอย่างเพียงพอเพื่อให้คุณสามารถสร้างรหัสย่อ WordPress ด้วยตัวเองเพื่อแก้ไขงานที่คุณต้องการ
ชมวิดีโอสอนเกี่ยวกับการสร้างรหัสย่อที่ซับซ้อนมากขึ้นที่นี่:
บ่อยครั้งในกระบวนการโพสต์เนื้อหาบนเว็บไซต์ คุณจะต้องรวมองค์ประกอบหนึ่งหรือองค์ประกอบอื่นไว้ในโพสต์ของคุณ การเขียนบางอย่างด้วยตนเองในแต่ละครั้งค่อนข้างไม่สะดวก โดยเฉพาะอย่างยิ่งหากมีส่วนแทรกดังกล่าวจำนวนมาก โดยเฉพาะอย่างยิ่งสำหรับสิ่งนี้ใน CMS WordPress โดยเริ่มจากเวอร์ชัน 2.5 มีการแนะนำฟังก์ชันพิเศษที่เรียกว่ารหัสย่อ
ในทางปฏิบัติ รหัสย่อคือโครงสร้างพิเศษที่อยู่ในวงเล็บเหลี่ยม ระบบเมื่อพบที่ไหนสักแห่งจะทดแทนค่าที่กำหนด รหัสย่อค่อนข้างได้รับความนิยมในธีมและปลั๊กอิน
มาดูการทำงานของรหัสย่อโดยใช้ปลั๊กอินแกลเลอรีรูปภาพเป็นตัวอย่าง ดังนั้น หลังจากติดตั้งและเปิดใช้งานแล้ว ส่วนพิเศษจะปรากฏในส่วนผู้ดูแลระบบของไซต์ WordPress ของคุณ ซึ่งมีเครื่องมือที่จำเป็นในการสร้างแกลเลอรี เมื่อเพิ่มรูปภาพและใช้การตั้งค่าที่จำเป็นแล้ว แกลเลอรีของคุณจะถูกบันทึก ตอนนี้ยังคงแสดงบนเว็บไซต์ ในการดำเนินการนี้ ปลั๊กอินจะแจ้งรหัสย่อเฉพาะให้คุณทราบ ณ จุดแทรกที่แกลเลอรีที่คุณสร้างขึ้นจะปรากฏขึ้น
รหัสย่อมีลักษณะดังนี้:
จะสร้างรหัสย่อใน WordPress ได้อย่างไร?
เครื่องมือ "เครื่องยนต์" ไม่เพียงแต่อนุญาตให้ใช้รหัสย่อที่มีอยู่เท่านั้น แต่ยังสร้างรหัสของคุณเองด้วย สิ่งนี้ต้องใช้ทักษะการเขียนโปรแกรม เราจะวางงานทั้งหมดของเราไว้ในไฟล์การกำหนดค่าหลักของธีม WordPress ที่ใช้งานอยู่ - functions.php.
หากคุณไม่ทราบวิธีแก้ไข functions.phpในกรณีนี้ ปลั๊กอิน ProFunctions จะช่วยคุณได้
ตัวอย่างเช่น เรามาสร้างรหัสย่อที่จะแสดงข้อความธรรมดากัน “เฮ้ WPSschool!”
เมื่อต้องการทำเช่นนี้ ให้เพิ่มบรรทัดต่อไปนี้ลงในไฟล์ด้านบน:
ฟังก์ชั่น wpschool_text_shortcode() ( return "สวัสดี WPSchool!"; ) add_shortcode("textshortcode", "wpschool_text_shortcode");
รหัสของเราประกอบด้วย 2 โครงสร้างหลัก ปิดกั้น ฟังก์ชั่น wpschool_text_shortcode()เป็นฟังก์ชันที่แสดงค่าที่ต้องการของรหัสย่อจริง ในกรณีของเรา นี่คือผลลัพธ์ของสตริงข้อความ “เฮ้ WPSschool!”
คำสั่ง add_shortcode()เป็นคำสั่งยูทิลิตี้ที่สร้างรหัสย่อเอง มันมีสองทางเลือก 'รหัสข้อความ'คือชื่อของรหัสย่อ ซึ่งสุดท้ายจะอยู่ในวงเล็บเหลี่ยม ในพารามิเตอร์ตัวที่สอง เราระบุชื่อฟังก์ชันของเราด้วยเอาต์พุตข้อความ
เป็นผลให้เราจะได้รับรหัสย่อต่อไปนี้พร้อมที่จะวาง:
มาเพิ่มในส่วนเนื้อหาของโพสต์หรือเพจกันดีกว่า
ด้วยเหตุนี้บนเว็บไซต์จะมีลักษณะดังนี้:
ในตัวอย่างต่อไปนี้ เราจะสร้างรหัสย่อสำหรับการแทรกรูปภาพตามขนาดที่กำหนด
ฟังก์ชั่น wpschool_picture_shortcode($atts) ( extract(shortcode_atts(array("width" => 100, "height" => 100,), $atts)); return " 
"; ) add_shortcode("รูปภาพ", "wpschool_picture_shortcode");
รหัสย่อของเราตอนนี้มีพารามิเตอร์ของฟังก์ชัน และยังมีอาร์กิวเมนต์ด้วย $แอท. ในการใช้พารามิเตอร์รหัสย่อ เราจำเป็นต้องมีสองฟังก์ชัน: รหัสย่อ_atts()และ สารสกัด(). อย่างแรกคือฟังก์ชั่นที่สร้างไว้ในแกนหลักของ WordPress ที่จับคู่แอตทริบิวต์รหัสย่อกับคุณสมบัติที่ส่งผ่านและกำหนดค่าเริ่มต้น (หากจำเป็น) สารสกัด()เป็นหน้าที่ของภาษา พี.เอช.พีซึ่งสร้างตัวแปรจากค่าอาร์เรย์ ฟังก์ชั่นของเราส่งคืนค่าที่เราต้องการ ( HTML- จัดวางภาพของเราด้วยค่าความสูงและความกว้างที่กำหนด)
ตอนนี้เมื่อมีการใช้รหัสย่อ รูปภาพที่เลือกจะถูกสร้างขึ้นด้วยมิติ 100 บน 100 . หากคุณต้องการเปลี่ยนขนาด รหัสย่อจะมีลักษณะดังนี้:
ฉันเพิ่งค้นพบว่าหลายคนไม่ทราบวิธีแทรกรหัสย่อลงใน WordPress หรือแสดงสคริปต์บนไซต์ด้วยเครื่องมืออื่น และผู้รู้และวิธีทำ เอาต์พุตรหัสย่อ PHPมักจะทำผิดพลาดร้ายแรง และสุดท้ายพวกเขาก็ตำหนิความจริงที่ว่าพวกเขามีปลั๊กอินหรือ รหัสย่อไม่ทำงานหรือมีบางอย่างผิดปกติกับเทมเพลตไซต์ แต่ในความเป็นจริง ทุกอย่างง่ายมาก และข้อผิดพลาดส่วนใหญ่เกิดขึ้นเนื่องจากการไม่ตั้งใจหรือไม่ใส่ใจไวยากรณ์และเครื่องหมายวรรคตอน
ยังไงไฟล์? ตอบสนองอย่างรวดเร็ว
โดยเฉพาะอย่างยิ่งสำหรับผู้ที่รู้ทุกอย่างแล้ว แต่เพียงต้องการคำตอบอย่างรวดเร็ว หรือสำหรับเครื่องมืออื่น โปรดใช้รหัสนี้:
php echo ทำรหัสย่อ WordPress
|
อย่างไรก็ตามอย่าลืมเครื่องหมายวรรคตอน! คำพูดในของคุณ รหัสย่อและ วีphp.iniรหัสจะต้องแตกต่าง
นั่นคือหากในเทมเพลตไซต์ WordPress ของคุณคุณใช้รหัสย่อเดียวกัน แต่มีเครื่องหมายคำพูดสองอันอยู่ข้างใน (["..."]) และในโค้ด php ของคุณคุณยังใช้เครื่องหมายคำพูดคู่ ("[...]") ด้วย จากนั้นคุณต้องเปลี่ยนอันใดอันหนึ่งเป็นอันเดียว ด้วยเหตุผลเล็กๆ น้อยๆ เช่นนั้นเอง รหัสย่อไม่ทำงานใน WordPress. เพิ่มเติมเกี่ยวกับเรื่องนี้ด้านล่าง
รหัสย่อคืออะไร(รหัสย่อ) และมีไว้เพื่ออะไร?
รหัสย่อคือจากอังกฤษ. "รหัสสั้น" ใช้เป็นหลักในการสร้างปลั๊กอินหรือโมดูลที่ออกแบบมาเพื่อทำงานกับระบบจัดการเนื้อหา (CMS) เช่น WordPress, Joomla เป็นต้น พูดง่ายๆ ก็คือโค้ดสั้น ๆ นี้เป็นทางลัดชนิดหนึ่งที่เมื่อเพิ่มลงในไซต์แล้วดึงขึ้นมาคือ โค้ดขนาดใหญ่ทั้งหมดจากปลั๊กอิน
รหัสย่อมักจะมีลักษณะดังนี้: ไม่ว่าจะเป็นสิ่งนี้หรือเพียงคำเดียว
ไม่ว่าในกรณีใดสิ่งนี้ไม่สำคัญนักเนื่องจากสิ่งสำคัญคือการรู้หลักการของการเพิ่มรหัสย่อลงในไซต์
มันทำงานอย่างไร?
ทุกอย่างง่ายมาก สมมติว่าคุณมีไซต์บนเครื่องมือ WordPress คุณมีเทมเพลต (การออกแบบ) ที่เรียบง่ายของไซต์ แต่เพื่อที่จะตกแต่งไซต์ คุณจึงตัดสินใจใส่แถบเลื่อนลงไป ซึ่งรูปภาพของคุณจะพลิกกลับด้วยตัวเอง มันง่ายมากที่จะทำเช่นนี้ ในการดำเนินการนี้ คุณต้องดาวน์โหลดปลั๊กอินตัวเลื่อนจากไลบรารีปลั๊กอิน WordPress ทั่วไป อัปโหลดรูปภาพที่จำเป็นที่นั่น จากนั้นปลั๊กอินจะให้โค้ดตัวเลื่อนขนาดเล็กแก่คุณ เช่น:
แต่เป็นเพียงโค้ดสั้น ๆ (Shortcode) ในบรรทัดเดียว:
โดยใส่อะไรประมาณนี้
รหัสย่อไปยังหน้าไซต์หรือวิดเจ็ต WordPress ปลั๊กอินของคุณจะเริ่มทำงานและจะสร้างโค้ดตัวเลื่อนขนาดใหญ่ด้านบน ดังนั้น คุณจะได้ตัวเลื่อนของคุณบนหน้าไซต์
ก วิธีใส่รหัสย่อแถบเลื่อนตรง สู่เทมเพลต WordPressในโค้ด php?
หากคุณต้องการโค้ดโดยตรงนักพัฒนาปลั๊กอินนี้ได้เขียนฟังก์ชันรหัสย่อในภาษา php ถัดจาก (รูปที่ด้านบน):
"ฟังก์ชั่น" ของรหัสย่อดังกล่าวสามารถแทรกลงในไฟล์ php ในตำแหน่งที่คุณต้องการบนเว็บไซต์ ตัวอย่างเช่น ใน header.php ที่ไหนสักแห่งหลังจากเนื้อหาหรืออาจจะเป็นใน sidebar.php และที่ดีที่สุดคือในไฟล์เทมเพลตเพจ (อาจเรียกได้ว่าเป็น content-page.php) ผลลัพธ์ที่ได้คือ แถบเลื่อนเดียวกัน แต่มีอยู่แล้วในการออกแบบของไซต์เอง
อย่างไรก็ตามคุณต้องระวังให้มากเมื่อใด การแสดงรหัสย่อในเทมเพลต WordPressในไฟล์ php ซึ่งต้องมีความรู้พื้นฐานเกี่ยวกับ php อย่างน้อย เพราะถ้าคุณแทรกมัน "ผิดที่" ในไฟล์ php ข้อผิดพลาดจะปรากฏบนไซต์
โดยปกติโค้ด php ใดๆ จะขึ้นต้นด้วย. ที่นี่ หลังจากสิ้นสุดโค้ด php หนึ่งและก่อนที่จะเริ่มต้นอีกโค้ดหนึ่ง คุณสามารถแทรกฟังก์ชัน php ของคุณได้ น่าเสียดายที่นักพัฒนาปลั๊กอินไม่ได้สร้างฟังก์ชัน php สำเร็จรูป (ดังในตัวอย่างนี้) เพื่อแสดงรหัสย่อเสมอไป ในกรณีนี้ คุณสามารถสร้างมันขึ้นมาเองได้อย่างง่ายดายและง่ายดาย โดยมีรายละเอียดเพิ่มเติมด้านล่าง
ยังไง แสดงรหัสย่อใน php.iniวี เวิร์ดเพรสหากไม่มีฟังก์ชัน php ที่พร้อมใช้งานในปลั๊กอิน?
มีปลั๊กอินที่นักพัฒนาของพวกเขาตัดสินใจที่จะไม่ระบุฟังก์ชัน php สำเร็จรูปสำหรับการแทรกรหัสย่อลงในไฟล์เทมเพลตไซต์ (เช่นในกรณีในตัวอย่างก่อนหน้า) แต่ระบุเฉพาะรหัสย่อเท่านั้น ตัวอย่างเช่น ในปลั๊กอินตัวเลื่อนนี้:
ในกรณีนี้ควรทำอย่างไรเนื่องจากเราต้องแทรกรหัสย่อลงในเทมเพลต WordPress และลงในไฟล์ php บนไซต์โดยตรง ในกรณีนี้คุณเพียงแค่ต้องห่อรหัสย่อด้วยตัวเองด้วยฟังก์ชันเอาต์พุต php ซึ่งแสดงไว้ที่ตอนต้นของบทความ ด้วยเหตุนี้ เมื่อคำนึงถึงรหัสย่อของเราแล้ว เราจึงได้ฟังก์ชัน php ประเภทนี้:
รหัสย่อ WordPress วิธีการฝัง
|
สามารถรวมเข้ากับเทมเพลตเว็บไซต์ใดก็ได้อย่างปลอดภัยแล้ว อย่างไรก็ตาม ใช้เวลาของคุณและอ่านด้านล่างเกี่ยวกับข้อผิดพลาดทั่วไปที่แม้แต่เว็บมาสเตอร์ที่มีประสบการณ์ก็ทำเมื่อเพิ่มรหัสย่อ
ข้อผิดพลาดครั้งใหญ่! หรือเหตุใดรหัสย่อของ wordpress จึงไม่ทำงาน?
ในตอนต้นของบทความฉันได้อธิบายวิธีการไปแล้ว เพิ่มรหัสย่อวี เวิร์ดเพรส,แล้วยังไง วางรหัสย่อลงไปพี.เอช.พี. มาสรุปทุกอย่างตอนนี้
จริงๆ แล้ว มีสองวิธีในการเพิ่ม คือ:
รหัสย่อของ wordpress ไปยังเทมเพลต
|
อย่างที่คุณเห็น ต่างกันแค่เครื่องหมายคำพูด - เดี่ยวและคู่ ไวยากรณ์ของภาษา php ระมัดระวังอย่างมากเกี่ยวกับคำพูดดังกล่าว และหากภายในฟังก์ชันที่สองซึ่งมีเครื่องหมายคำพูดสองอัน คุณใส่รหัสย่อด้วยเครื่องหมายคำพูดสองอันด้วย เช่นอย่างที่เรามี คุณจะได้รับข้อผิดพลาดบนไซต์
เพื่อให้ไม่มีข้อผิดพลาดและรหัสย่อของคุณทำงานได้อย่างถูกต้อง คุณจะต้องมีเครื่องหมายคำพูดที่แตกต่างกัน ตัวอย่างเช่นเช่นนี้:
คุณสามารถเพิ่มรหัสย่อสองรหัสแรกลงในเทมเพลต WordPress ของคุณได้ในตัวแก้ไข ในการดำเนินการนี้ ให้ค้นหาไฟล์ php ที่เหมาะสมในตัวแก้ไขไซต์ที่ควบคุม "สถานที่" บนไซต์ที่คุณต้องการแสดงแถบเลื่อน คุณสามารถค้นหาสถานที่นี้ได้ในเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ในเบราว์เซอร์ของคุณโดยกดแป้นพิมพ์ลัด Ctrl + Shift + I
