Open Graph สำหรับปุ่มไลค์มีประโยชน์อย่างไร วิธีเพิ่มเมตาแท็กโซเชียลโปรโตคอลกราฟเปิดสำหรับ Facebook ใน Joomla การเพิ่มโปรโตคอล Open Graph ใน Joomla

บ้าน น่าเสียดายที่มีข้อมูลน้อยมากเกี่ยวกับปัญหานี้บนอินเทอร์เน็ต โดยเฉพาะใน RuNet ทั้งหมดที่ Google สามารถเสนอให้เราแก้ปัญหาการแทรกโปรโตคอลกราฟเปิดลงใน Joomla? นี่คือปลั๊กอินบางตัวที่ให้คุณแทรกเมตาและแท็กส่วนหัวของคุณเองได้ หนึ่งในสิ่งที่ได้รับความนิยมคือ ITP Meta หลักการทำงานของมันรุ่นฟรี

แปลกที่จะพูดน้อยที่สุด หลังจากที่คุณสร้างบทความแล้ว คุณจะต้องเขียนเมตาแท็กแยกกันสำหรับเนื้อหาแต่ละรายการ ไม่อยากทนกับงานประจำแบบนี้ ผมขอแนะนำให้คุณใช้วิธีของผม

ก่อนอื่น เพื่อให้ชัดเจนว่าทำไมคุณต้องติดตั้งโปรโตคอล Open Graph สำหรับ facebook ในส่วนหัวของ Joomla นี่คือลักษณะของวัสดุที่ไม่มีหมายเหตุพิเศษ และนี่คือลักษณะที่เขามองกับทุกคนบันทึกที่จำเป็น

- โดยสิ่งสำคัญฉันหมายถึงพื้นฐาน เนื่องจากมีบันทึกจำนวนมาก แท็กเนื้อบางรายการของโปรโตคอล Open Graph ที่จะอยู่ในบทความนี้จึงไม่จำเป็นสำหรับ Facebook จริงๆ แต่จำเป็นสำหรับ Pinterest เช่น

  • การเพิ่มโปรโตคอล Open Graph ให้กับ Joomla ไปที่นี่กันเถอะ:
  • /components/com_content/views/article/tmpl เปิดไฟล์:
  • default.php จากนั้นมองหาบรรทัดที่ 14 พร้อมความคิดเห็น:
  • // สร้างทางลัดไปยังพารามิเตอร์บางตัว ถัดไป คุณต้องกำหนดตัวแปรสำหรับวันที่สร้างบทความ เมื่อต้องการทำเช่นนี้ เพิ่มบรรทัดต่อไปนี้ที่ใดก็ได้ในรายการตัวแปร เป็นผลให้มีตัวแปรใหม่ปรากฏขึ้น$datepubl
- ตัวอย่างเช่น นี่คือวิธีการทำงานสำหรับฉัน $user = JFactory::getUser(); $datepubl = $this->item->created; $info = $params->get("info_block_position", 0); < meta property = "og:title" content = if (isset($images -> image_intro) และ !empty($images -> image_intro)) ( $timage = htmlspecialchars(JURI:: root().$images -> image_intro); ) elseif (isset($images -> image_fulltext) และ !empty($images -> image_fulltext)) ( $timage = htmlspecialchars(JURI:: root().$images -> image_fulltext); ) else ( $timage = "http://komarovdesign.com/images/ logo_12x.png"; ) $doc =& JFactory::getDocument(); $doc -> addCustomTag("/> < meta property = "og:type" content = "article" /> < meta property = "og:url" content = "".JURI:: current()."" /> < meta property = "og:image" content = "".$timage."" /> < meta property = "og:site_name" content = "".$this -> Escape($this -> item -> title)""/> < meta property = "article:published_time" content = "".$datepubl."" /> < meta property = "article:author" content = "Artem" /> < meta property = "fb:admins" content = "100007059401635" /> ");

อย่างที่คุณเห็นทุกอย่างเรียบง่าย สำหรับรูปภาพ ให้เรียงลำดับดังนี้: หากไม่มีรูปภาพสำหรับส่วนเกริ่นนำของเนื้อหา จะมีการถ่ายภาพของเนื้อหาทั้งหมด หากไม่มีก็จะถ่ายโลโก้ของเว็บไซต์ แน่นอน คุณต้องระบุโดยแทนที่ด้วยของคุณเองในบรรทัด "http://komarovdesign.com/images/logo_12x.png"

ถัดไป คุณต้องจดคำอธิบายเว็บไซต์ของคุณด้วยตนเองในบรรทัด “og:site_name” ระบุผู้เขียนบทความ "article:author" ในบรรทัด "fb:admins" คุณต้องป้อน ID ของโปรไฟล์ Facebook ของคุณ

หากคุณอ่านอย่างละเอียด คุณจะสังเกตเห็นว่าไม่มีแท็กหลัก “og:description” มันถูกเพิ่มเข้าไปในไฟล์อื่น

  • การเพิ่มโปรโตคอล Open Graph ให้กับ Joomla ไลบรารี/joomla/เอกสาร/html/renderer/
  • /components/com_content/views/article/tmpl head.php
  • เรากำลังมองหาบรรทัดที่ 106 ประมาณพร้อมความคิดเห็น: // อย่าเพิ่มคำอธิบายที่ว่างเปล่า
  • และหลังหลัก คำอธิบายแทรกเมตาแท็กโปรโตคอล Open Graph ผลลัพธ์ควรเป็นดังนี้
( $buffer .= $tab . " " . $lnEnd; $buffer .= $tab ” " . $lnEnd; )

Open Graph มีประโยชน์สำหรับการใช้งานบน Facebook, VKontakte และเครือข่ายอื่น ๆ

เรามาฝึกซ้อมกันดีกว่า ผู้ดูแลเว็บควรทำอย่างไรเพื่อให้แน่ใจว่าภาพที่คุณต้องการจะถูกจับภาพ?

หากคุณเพิ่มโพสต์ใหม่โดยใช้ปุ่มที่ติดตั้งด้วยตนเองบนเว็บไซต์ คุณสังเกตเห็นแล้วว่าภาพขนาดย่อพร้อมกับประกาศสามารถเผยแพร่ได้ รวมถึงเครื่องนับติ๊กแทนดีไซน์ที่สวยงามและคัดสรรมาเป็นพิเศษ หากคุณเพิ่มด้วยตนเอง คุณจะสามารถแก้ไขได้ทันทีและหลีกเลี่ยงกราฟิกที่ไม่เหมาะสม แต่คุณต้องการทำทุกอย่างโดยไม่ต้องคลิกที่ไม่จำเป็นเสมอ นอกจากนี้ ด้วยการโพสต์ข้ามอัตโนมัติ รูปภาพจะไม่สามารถเปลี่ยนแปลงได้

นอกจากนี้ยังมีเรื่องไร้สาระอื่นๆ ที่แสดงชื่อเรื่อง คำอธิบาย ฯลฯ ดังนั้นผู้พัฒนาโซเชียล เครือข่ายมีมาร์กอัปพิเศษ ]]> Open Graph ]]>

ควรสังเกตว่า Yandex เสนอโซลูชัน 5 ประการสำหรับการติดตั้งมาร์กอัปขนาดเล็ก

เพื่อหลีกเลี่ยงเหตุการณ์ต่างๆ ผู้ดูแลเว็บสามารถเพิ่มเมตาแท็ก Open Graph ต่อไปนี้ระหว่างแท็กได้

เพื่อแท็ก เพิ่มเส้นทางไปยัง xmlns อย่าลืมใส่โค้ดทั้งหมดไว้ในวงเล็บ:

html xmlns:og="https://ogp.me/ns#"

ตัวอย่างโค้ดอื่น ใส่โค้ดในวงเล็บ:

Html xmlns="https://www.w3.org/1999/xhtml" xml:lang="th-TH" lang="th-TH" prefix="og: https://ogp.me/ns# วิดีโอ : https://ogp.me/ns/video# ใช่: https://webmaster.yandex.ru/vocabularies/"

โซลูชันกลไกสำเร็จรูปสำหรับการเพิ่มเมตาแท็ก Open Graph

สำหรับปลั๊กอิน WordPress:

เมตา OpenGraph ของ Facebook- ดาวน์โหลด https://wordpress.org/plugins/facebook-opengraph-meta/

เครื่องมือสร้าง Opengraph และ Microdata- ดาวน์โหลด https://wordpress.org/plugins/opengraph-and-microdata-generator/

สำหรับโมดูล Drupal:

เปิดเมตาแท็กกราฟดาวน์โหลดสำหรับเวอร์ชัน 6 และ 7 จากลิงก์ https://drupal.org/project/opengraph_meta

โมดูล เมตาแท็กกำหนดค่าเมตาแท็กใน Drupal 7 และพารามิเตอร์บางตัวจากโปรโตคอล Open Graph ดาวน์โหลด https://drupal.org/project/metatag

ปลั๊กอินสำหรับ Joomla

เปิดกราฟง่าย ๆโพสต์รูปภาพขนาดเล็ก ประกาศสั้นๆ และลิงก์ไปยังส่วนความสนใจบน Facebook เลือกเวอร์ชัน Joomla และดาวน์โหลด https://extensions.joomla.org/extensions/social-web/facebook-integration/17883

ดู og: มาร์กอัปเมื่อเปลี่ยนรูปภาพ ชื่อเรื่อง ฯลฯ คุณสามารถใช้เครื่องมือ URL Linter ได้ที่ https://developers.facebook.com/tools/debug

เฟสบุ๊คเป็นหนึ่งในเครื่องมือหลักสำหรับการตอบรับจากผู้เยี่ยมชมเว็บไซต์ และแน่นอนว่าเป็นเครื่องมือในการโปรโมตแหล่งข้อมูลต่างๆ ปุ่ม "แบ่งปัน"และ "ชอบ"สำคัญสำหรับทรัพยากรของคุณ แต่ข้อมูลประเภทใดที่หุ่นยนต์ควรรับไม่ชัดเจน แต่ละไซต์มีโครงสร้างที่แตกต่างกันและหุ่นยนต์จะเป็นอย่างไร เฟสบุ๊คฉันไม่ได้แยกวิเคราะห์เนื้อหาแบบสุ่ม แต่มีโปรโตคอล เปิดกราฟ- คืออะไร และช่วยให้ชีวิตของหุ่นยนต์และเว็บมาสเตอร์ง่ายขึ้นได้อย่างไร

ฉันจะแสดงตัวอย่างที่ชัดเจนเพื่อให้ชัดเจนว่าทำไมคุณต้องใส่ เปิดกราฟสำหรับ เฟสบุ๊คในส่วนหัว จูมล่า- นี่คือลักษณะของวัสดุที่ไม่มีรายการพิเศษ:

และนี่คือสิ่งที่ดูเหมือนกับบันทึกคุณสมบัติเมตาที่จำเป็นทั้งหมด เนื่องจากมีบันทึกจำนวนมาก แท็กโปรโตคอลคุณสมบัติเมตาบางรายการจึงระบุไว้ เปิดกราฟซึ่งจะอยู่ในบทความนี้ไม่จำเป็นจริงๆสำหรับ เฟสบุ๊คแต่จำเป็นสำหรับโซเชียลเน็ตเวิร์กอื่นๆ

โครงสร้างมาร์กอัปเอาต์พุตของส่วนประกอบนั้นง่ายมาก:

/templates/html/component_name/view_name/markup_filename.php มาดูตัวอย่างกัน หากเราต้องการเขียนทับมาร์กอัปเริ่มต้นสำหรับผลลัพธ์ของบทความ เราต้องคัดลอกไฟล์นี้ก่อน: /components/com_content/views/article/tmpl/default.php ไปยังตำแหน่งนี้ สร้างไดเรกทอรีที่เหมาะสมในกรณีที่ยังไม่มีอยู่ : /templates/template_name/html/com_content/article/default.php ในไฟล์ default.php หลังจากบล็อกนี้: /** * @package Joomla.Site * @subpackage com_content * * @copyright Copyright (C) 2005 - 2015 Open Source เรื่องอิงค์ สงวนลิขสิทธิ์.

* @license GNU General Public License เวอร์ชัน 2 หรือใหม่กว่า; ดู LICENSE.txt */ Defined("_JEXEC") หรือ die; JHtml::addIncludePath(JPATH_COMPONENT . "/helpers"); // สร้างทางลัดไปยังพารามิเตอร์บางตัว $params = $this->item->params; $images = json_decode($this->item->images); $urls = json_decode($this->item->urls); $canEdit = $params->get("เข้าถึง-แก้ไข"); $user = JFactory::getUser(); $info = $params->get("info_block_position", 0); JHtml::_("พฤติกรรมคำบรรยาย");

เพิ่มรหัสต่อไปนี้:

//OpenGraph start $datepubl = $this->item->created; if (isset($images -> image_intro) และ !empty($images -> image_intro)) ( $timage = htmlspecialchars(JURI:: root().$images -> image_intro); ) elseif (isset($images -> image_fulltext) และ !empty($images -> image_fulltext)) ( $timage = htmlspecialchars(JURI:: root().$images -> image_fulltext); ) else ( $timage = "default_logo.jpg"; ) $document =& JFactory::getDocument(); if($this->item->metadesc == "") ($mmd = strip_tags($this->item->introtext);) else ($mmd = $this->item->metadesc;) $document - > addCustomTag(" Escape($this -> item -> title)""/> "); //จบ OpenGraph อย่างที่คุณเห็นทุกอย่างเรียบง่าย แสดงภาพโดยตามหลักการดังต่อไปนี้

- หากไม่มีรูปภาพสำหรับส่วนเกริ่นนำของเนื้อหา จะแสดงรูปภาพของเนื้อหาที่สมบูรณ์ หากไม่มี ระบบจะถ่ายภาพเริ่มต้น จะต้องระบุโดยแทนที่ด้วยบรรทัดของคุณเอง

$timage = "default_logo.jpg";

แท็กหลัก "og:description" ถูกสร้างขึ้นดังนี้: หากไม่มีแท็กคำอธิบายเมตาที่สมบูรณ์สำหรับบทความ ระบบจะนำข้อความเกริ่นนำของเนื้อหาไปใช้

หลังจากการดำเนินการทั้งหมดนี้ เราสามารถตรวจสอบได้ว่าเราทำทุกอย่างถูกต้องหรือไม่ เครื่องมือนี้จะช่วยเราในเรื่องนี้โซลูชันโปรโตคอลแบบเปิดกราฟ

ในขณะนี้ เวอร์ชันส่วนขยายช่วยให้คุณทำงานกับ Joomla 2.5 และ 3.6x ได้

การทำงานกับเนื้อหาของไซต์ต่างๆ เป็นสิ่งสำคัญสำหรับเจ้าของทุกคน ไม่สนใจ ในขณะนี้จะไม่อนุญาตให้คุณเพิ่มคะแนนของคุณ เครื่องมือค้นหาวี สภาพแวดล้อมที่แตกต่างกันซึ่งอาจส่งผลเสียต่อการเข้าชมไซต์ รวมถึงด้านการเงินของปัญหา หากท่านต้องการทราบเกี่ยวกับ ปัญหาที่มีอยู่ไซต์ของคุณ คุณสามารถตรวจสอบไซต์เพื่อหาข้อผิดพลาดเพื่อตรวจจับและกำจัดข้อผิดพลาดได้ทันท่วงที

เนื่องจากปริมาณข้อมูลบนไซต์โซเชียลและไซต์ที่ใช้ web2.0 เริ่มเพิ่มขึ้น เทคโนโลยี Open Graph Protocol ได้เข้ามาแทนที่หนึ่งในตำแหน่งสำคัญในการจัดการ Open Graph Protocol (OGP) ช่วยให้นักพัฒนาหรือเจ้าของเว็บไซต์สามารถรวมไซต์/เพจ/โพสต์ของตนเข้ากับการเข้าชมโซเชียลได้ การใช้ OGP ทำให้สามารถถ่ายโอนข้อมูลจำนวนมากได้ เช่น ชื่อ คำอธิบาย รูปภาพ แท็กตำแหน่งทางภูมิศาสตร์ ผู้แต่ง ฯลฯ OGP ได้กลายเป็นส่วนสำคัญในการทำให้เพจของคุณเป็นมิตรกับโซเชียลมีเดียมากขึ้น

เมื่อติดตั้ง Open Graph Protocol Solution แล้ว จะเพิ่มไอคอน OGP ที่ด้านล่างของโปรแกรมแก้ไขบทความในแบ็กเอนด์ Joomla ซึ่งคุณสามารถป้อนแท็ก OGP ได้ องค์ประกอบนี้ยังช่วยให้สามารถแสดงรายการบทความทั้งหมดได้ การจัดการที่ดีขึ้นแท็กบทความ OGP

เราแสดงรายการความสามารถในการขยายหลัก:

ตัวเลือกพื้นฐาน

  • ความสามารถในการลบหน้าต่างป๊อปอัป
  • ลบ RSS;
  • รองรับฟังก์ชั่นการลบ Ajax

ส่วนประกอบที่รองรับ:

  • ComContent (ผู้จัดการบทความ);
  • K2 (Comk2);
  • เนื้อหา Flexi (ComFlexicontent);
  • เวอร์ช่วลมาร์ท (ComVirtuemart);
  • DJ-แคตตาล็อก (Comdj-แคตตาล็อก);
  • สวนสัตว์ (ComZoo);
  • การเปิดใช้งานหรือปิดใช้งานส่วนประกอบใด ๆ โดยผู้ดูแลระบบหรือส่วนหนึ่งของส่วนหน้าแยกจากกัน
  • ความสามารถในการกำหนดค่าฟังก์ชันผู้ดูแลระบบสำหรับแท็กเปิดเริ่มต้น

น่าเสียดายที่มีข้อมูลน้อยมากเกี่ยวกับปัญหานี้บนอินเทอร์เน็ต โดยเฉพาะใน RuNet ทั้งหมดที่ Google สามารถเสนอให้เราแก้ปัญหาการแทรกโปรโตคอลกราฟเปิดลงใน Joomla? นี่คือปลั๊กอินบางตัวที่ให้คุณแทรกเมตาและแท็กส่วนหัวของคุณเองได้ หนึ่งในสิ่งที่ได้รับความนิยมคือ ITP Meta หลักการทำงานของเวอร์ชันฟรีนั้นแปลก หากพูดง่ายๆ ก็คือ หลังจากที่คุณสร้างบทความแล้ว คุณจะต้องเขียนเมตาแท็กแยกกันสำหรับเนื้อหาแต่ละรายการ ไม่อยากทนกับงานประจำแบบนี้ ผมขอแนะนำให้คุณใช้วิธีของผม

แปลกที่จะพูดน้อยที่สุด หลังจากที่คุณสร้างบทความแล้ว คุณจะต้องเขียนเมตาแท็กแยกกันสำหรับเนื้อหาแต่ละรายการ ไม่อยากทนกับงานประจำแบบนี้ ผมขอแนะนำให้คุณใช้วิธีของผม

และนี่คือสิ่งที่ดูเหมือนกับรายการที่จำเป็นทั้งหมด โดยสิ่งสำคัญฉันหมายถึงพื้นฐาน เนื่องจากมีบันทึกจำนวนมาก แท็กเนื้อบางรายการของโปรโตคอล Open Graph ที่จะอยู่ในบทความนี้จึงไม่จำเป็นสำหรับ Facebook จริงๆ แต่จำเป็นสำหรับ Pinterest เช่น

- โดยสิ่งสำคัญฉันหมายถึงพื้นฐาน เนื่องจากมีบันทึกจำนวนมาก แท็กเนื้อบางรายการของโปรโตคอล Open Graph ที่จะอยู่ในบทความนี้จึงไม่จำเป็นสำหรับ Facebook จริงๆ แต่จำเป็นสำหรับ Pinterest เช่น

  • การเพิ่มโปรโตคอล Open Graph ให้กับ Joomla ไปที่นี่กันเถอะ:
  • /components/com_content/views/article/tmpl เปิดไฟล์:
  • default.php จากนั้นมองหาบรรทัดที่ 14 พร้อมความคิดเห็น:
  • // สร้างทางลัดไปยังพารามิเตอร์บางตัว ถัดไป คุณต้องกำหนดตัวแปรสำหรับวันที่สร้างบทความ เมื่อต้องการทำเช่นนี้ เพิ่มบรรทัดต่อไปนี้ที่ใดก็ได้ในรายการตัวแปร เป็นผลให้มีตัวแปรใหม่ปรากฏขึ้น$datepubl
- ตัวอย่างเช่น นี่คือวิธีการทำงานสำหรับฉัน $user = JFactory::getUser(); $datepubl = $this->item->created; $info = $params->get("info_block_position", 0); < meta property = "og:title" content = if (isset($images -> image_intro) และ !empty($images -> image_intro)) ( $timage = htmlspecialchars(JURI:: root().$images -> image_intro); ) elseif (isset($images -> image_fulltext) และ !empty($images -> image_fulltext)) ( $timage = htmlspecialchars(JURI:: root().$images -> image_fulltext); ) else ( $timage = "http://komarovdesign.com/images/ logo_12x.png"; ) $doc =& JFactory::getDocument(); $doc -> addCustomTag("/> < meta property = "og:type" content = "article" /> < meta property = "og:url" content = "".JURI:: current()."" /> < meta property = "og:image" content = "".$timage."" /> < meta property = "og:site_name" content = "".$this -> Escape($this -> item -> title)""/> < meta property = "article:published_time" content = "".$datepubl."" /> < meta property = "article:author" content = "Artem" /> < meta property = "fb:admins" content = "100007059401635" /> ");

อย่างที่คุณเห็นทุกอย่างเรียบง่าย สำหรับรูปภาพ ให้เรียงลำดับดังนี้: หากไม่มีรูปภาพสำหรับส่วนเกริ่นนำของเนื้อหา จะมีการถ่ายภาพของเนื้อหาทั้งหมด หากไม่มีก็จะถ่ายโลโก้ของเว็บไซต์ แน่นอน คุณต้องระบุโดยแทนที่ด้วยของคุณเองในบรรทัด "http://komarovdesign.com/images/logo_12x.png"

ถัดไป คุณต้องจดคำอธิบายเว็บไซต์ของคุณด้วยตนเองในบรรทัด “og:site_name” ระบุผู้เขียนบทความ "article:author" ในบรรทัด "fb:admins" คุณต้องป้อน ID ของโปรไฟล์ Facebook ของคุณ

หากคุณอ่านอย่างละเอียด คุณจะสังเกตเห็นว่าไม่มีแท็กหลัก “og:description” มันถูกเพิ่มเข้าไปในไฟล์อื่น

  • การเพิ่มโปรโตคอล Open Graph ให้กับ Joomla ไลบรารี/joomla/เอกสาร/html/renderer/
  • /components/com_content/views/article/tmpl head.php
  • เรากำลังมองหาบรรทัดที่ 106 ประมาณพร้อมความคิดเห็น: // อย่าเพิ่มคำอธิบายที่ว่างเปล่า
  • และหลังหลัก คำอธิบายแทรกเมตาแท็กโปรโตคอล Open Graph ผลลัพธ์ควรเป็นดังนี้
( $buffer .= $tab . " " . $lnEnd; $buffer .= $tab ” " . $lnEnd; )

อ่านอะไรอีก.