Subtitling the titles of Joomla titles|It will make for a longer descriptive text

Descriptive titles do add some SEO power to your posts, but they can get quite long and chunky. Though in some cases, chunky looks good on the page.

With this little snippet, you can develop a template that displays the title with a sub title option.

It will turn

The greatest show on Earth is the one that is great. Mike and Alex now have the greatest show

Into

The greatest show on Earth is the one that is great.
Mike and Alex now have the greatest show

Just by adding a vertical pipe '|' at the point where you want to break the text and a style class to do some stuff to each line. All while remaining a H1 tag.

So you would write your article title as

The greatest show on Earth is the one that is great.|Mike and Alex now have the greatest show

Add the following to the PHP head of your template's index.php file

//define variables to determine component and view mode
$option = JRequest::getCmd('option');
$view = JRequest::getCmd('view');

//check if is content component in article view tmpl
if ($option == "com_content" && $view == "article") {
    $ids = explode(':',JRequest::getString('id'));
    $article_id = $ids[0];
    $article = JTable::getInstance("content");
    $article->load($article_id);
    $pgtitle = $article->get("title");
}

//if not equal content component in article view
//use the menu title or page title override 
//or current component title
else { $pgtitle = $params->get('page_heading'); }

//check if a vertical pipe is in the title string
//and if true do the function
if(strpos($pgtitle, "|")) {

//define the subtile variable by separating before 
//and after the pipe in an array
	$subtitle = explode("|", $pgtitle);

//select which array value to apply wrappers
//can be whatever you want
	$subtitle[1] = '<span>'.$subtitle[1].'</span>';

//define the the printed title variable by reassembling the array
//now with the wrapper included
	$pgtitle = implode("|", $subtitle);

//remove the pipe before printing
	$pgtitle = str_replace("|", "", $pgtitle);
}

 Now add the pgtitle variable to the HTML section of the index.php file. You will want it to be at the top.

<h1 class="pageheading"><?php echo $pgtitle; ?></h1>

 So the output will be

<h1 class="pageheading">QuickStart Website Package: $250<span>Ideal for any website concept. Plug'n Play</span></h1>

Now you can add the CSS as desired. See it in action

 

Of course if the default article template remains unchanged, there will be duplicate titles on the page. You can simply disable titles per article or by the menu item parameter.

The recommended option is to create an article override file in your template system and delete the title HTML coding.

Descriptive titles do add some SEO power to your posts, but they can get quite long and chunky. Though in some cases, chunky looks good on the page.

With this little snippet, you can develop a template that displays the title with a sub title option.

It will turn

The greatest show on Earth is the one that is great. Mike and Alex now have the greatest show

Into

The greatest show on Earth is the one that is great.
Mike and Alex now have the greatest show

Just by adding a vertical pipe '|' at the point where you want to break the text and a style class to do some stuff to each line. All while remaining a H1 tag.

So you would write your article title as

The greatest show on Earth is the one that is great.|Mike and Alex now have the greatest show

Add the following to the PHP head of your template's index.php file

//define variables to determine component and view mode
$option = JRequest::getCmd('option');
$view = JRequest::getCmd('view');

//check if is content component in article view tmpl
if ($option == "com_content" && $view == "article") {
    $ids = explode(':',JRequest::getString('id'));
    $article_id = $ids[0];
    $article = JTable::getInstance("content");
    $article->load($article_id);
    $pgtitle = $article->get("title");
}

//if not equal content component in article view
//use the menu title or page title override 
//or current component title
else { $pgtitle = $params->get('page_heading'); }

//check if a vertical pipe is in the title string
//and if true do the function
if(strpos($pgtitle, "|")) {

//define the subtile variable by separating before 
//and after the pipe in an array
	$subtitle = explode("|", $pgtitle);

//select which array value to apply wrappers
//can be whatever you want
	$subtitle[1] = '<span>'.$subtitle[1].'</span>';

//define the the printed title variable by reassembling the array
//now with the wrapper included
	$pgtitle = implode("|", $subtitle);

//remove the pipe before printing
	$pgtitle = str_replace("|", "", $pgtitle);
}

 Now add the pgtitle variable to the HTML section of the index.php file. You will want it to be at the top.

<h1 class="pageheading"><?php echo $pgtitle; ?></h1>

 So the output will be

<h1 class="pageheading">QuickStart Website Package: $250<span>Ideal for any website concept. Plug'n Play</span></h1>

Now you can add the CSS as desired. See it in action

 

Of course if the default article template remains unchanged, there will be duplicate titles on the page. You can simply disable titles per article or by the menu item parameter.

The recommended option is to create an article override file in your template system and delete the title HTML coding.

Article Override Modification

 

Add the modification to the article override file instead

If you prefer to add this modification to just the article template file and retain the structure of your default site template, this method will get it done.

Bust out the old article override file and do the following edits

At the top in the PHP declarations, add this coding below whatever is already there

//check for page heading or article title
//and define the same variable for either case
if ($this->params->get('show_page_heading')) {
$pgtitle = $this->params->get('show_page_heading'); 
}
else {
$pgtitle = $this->escape($this->item->title);
}

//run di ting as before
if(strpos($pgtitle, "|")) {
	$subtitle = explode("|", $pgtitle);
	$subtitle[1] = '<span>'.$subtitle[1].'</span>';
	$pgtitle = implode("|", $subtitle);
	$pgtitle = str_replace("|", "", $pgtitle);
}

 The default Joomla article view template title HTML looks like this

<?php if ($this->params->get('show_page_heading')) : ?>
	<h1>
	<?php echo $this->escape($this->params->get('page_heading')); ?>
	</h1>
<?php endif; ?>
<?php
if (!empty($this->item->pagination) AND $this->item->pagination && !$this->item->paginationposition && $this->item->paginationrelative)
{
 echo $this->item->pagination;
}
 ?>

<?php if ($params->get('show_title')) : ?>
	<h2>
	<?php if ($params->get('link_titles') && !empty($this->item->readmore_link)) : ?>
		<a href="/<?php echo $this->item->readmore_link; ?>">
		<?php echo $this->escape($this->item->title); ?></a>
	<?php else : ?>
		<?php echo $this->escape($this->item->title); ?>
	<?php endif; ?>
	</h2>
<?php endif; ?>

 I recommend this format with the new variable $pgtitle replacing where $this->escape etc is

<?php if ($this->params->get('show_page_heading', 1)) : ?>
		<h1 class="pageheading">
		<?php echo $pgtitle; ?>
		</h1>
	<?php else:
		if($params->get('show_title')) : ?>
			<h1 class="pageheading">
			<?php if ($params->get('link_titles') && !empty($this->item->readmore_link)) : ?>
				<a href="/<?php echo $this->item->readmore_link; ?>">
				<?php echo $pgtitle; ?></a>
			<?php else :
				 echo $pgtitle;
			 endif; ?>
			</h1>
		<?php endif;
	endif;
	?>

 The same result as with the default site template will occur.

All good!

 

Copyright © 2019 CMSEnergizer.com. All Rights Reserved.
This website is powered by the Joomla!©™ 3 Website Framework | File download and article manager component by CMSE Custom Fields | Advanced Module Manager and Modules Anywhere by NoNumber Elements | Website hosting and development by WebsiteDons

CMSEnergizer.com is owned and operated by Emuzement Net Inc, Tampa, Florida USA