0
Welcome Guest! Login
0 items Join Now

Twitter Cards... Adding code to <head> or a plugin to do it

  • Twitter Cards... Adding code to <head> or a plugin to do it

    Posted 7 years 8 months ago
    • Hi guys,

      I've searched and can't find an answer to this subject. I want my posts to twitter from my sites to be nice shiny twitter cards.
      I did get some code which needs to be added to the head section of my site but I can't figure out how to do it (using Rt_ethereal template).

      I'd like to know how to add this to the head section please or even better the name of a good plugin that will simply do the work for me of creating nice twitter cards & facebook OG style posts.

      Thanks,

      Aran

      Heres the code:

      if       (isset($images->image_intro) and !empty($images->image_intro))
            {
               $timage= htmlspecialchars(JURI::root().$images->image_intro);
            }
      elseif   (isset($images->image_fulltext) and !empty($images->image_fulltext))
             {
               $timage= htmlspecialchars(JURI::root().$images->image_fulltext);
             }
      else
             {
               $timage= 'http://www.example.com/default-image.jpg';
             }
      $doc =& JFactory::getDocument();
      $doc->addCustomTag( '
      <meta name="twitter:title" content="'.$this->escape($this->item->title).'">
      <meta name="twitter:card" content="summary">
      <meta name="twitter:site" content="@TwitterUsernameOfWebsite"> 
      <meta name="twitter:creator" content="@TwitterUsernameOfAuthor"> 
      <meta name="twitter:url" content="'.JURI::current().'">
      <meta name="twitter:description" content="'.strip_tags($this->item->introtext).'">
      <meta name="twitter:image" content="'.$timage.'">
      <meta property="og:title" content="'.$this->escape($this->item->title).'"/>
      <meta property="og:type" content="article"/>
      <meta property="og:email" content="info@example.com"/>
      <meta property="og:url" content="'.JURI::current().'"/>
      <meta property="og:image" content="'.$timage.'"/>
      <meta property="og:site_name" content="Your Website Name Here"/>
      <meta property="fb:admins" content="johndoe.3"/>
      <meta property="og:description" content="'.strip_tags($this->item->introtext).'"/>
      ');
    • Last Edit: 7 years 8 months ago by Aran Gibbs.
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: Twitter Cards... Adding code to <head> or a plugin to do it

    Posted 7 years 8 months ago
    • That code is php - so you would need to use something like "sourcerer" from Regular labs to add that code to a customHTML module or in an article (either of which would have to appear on the page).

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • Stephen Cassidy's Avatar
    • Stephen Cassidy
    • Sr. Rocketeer
    • Posts: 213
    • Thanks: 13
    • Webmaster - ICT Manager

    Re: Twitter Cards... Adding code to <head> or a plugin to do it

    Posted 7 years 8 months ago
    • I don't know why you need the php? If you go to dev.twitter.com/cards you can let Twitter generate various cards for you with just meta name and properties. Mine is below and works in all RocketTheme templates.
      You can see that it's placed just above the </head>.

      Tip: if your images do not show on Twitter it's because the size of the image is wrong ;)
      Negative side: update the template and you Twitter card has flown, you will have to add the card again.

      Test Twitter card: cards-dev.twitter.com/validator

      <!-- Begin Twitter Cards by Stephen Cassidy -->
      <meta name="twitter:card" content="summary_large_image">
      <meta name="twitter:site" content="@stephencassidy">
      <meta name="twitter:creator" content="@stephencassidy">
      <meta name="twitter:title" content="Web design, Street & Event photography.">
      <meta name="twitter:description" content="Wekelijks maakt ik foto's van de Kleine Wereld van Sjaak en Yvonne. We (her)ontdekken Velsen, en geven vanuit hun perspectief een humoristisch ‘klein’ kijkje op de ‘grote’ wereld van Velsen">
      <meta name="twitter:image" content=" www.stephencassidy.nl/images/miniature-figures-people.jpg ">
      <!-- End Twitter Cards by Stephen Cassidy -->
      </head>
    • The following users have thanked you: MrT

    • The more I practice, the luckier I get...

Time to create page: 0.050 seconds