Viglink

Author Topic: [Tip/Trick]  How to add a 'Read More' button to Board News in Simple Portal  (Read 5549 times)


0 Members and 1 Guest are viewing this topic.

July 07, 2013, 05:22:30 PM

Offline Brian

  • Administrator
  • Jr. Member
  • *
  • Posts: 49
  • Country: us
  • Karma: 0
    • View Profile
[Tip/Trick] How to add a 'Read More' button to Board News in Simple Portal
« on: July 07, 2013, 05:22:30 PM »

(Register to disable this ad!)
"ns"

Simple Portal is one of my favorite portals because it's easy to use and easy to customize. One feature of the 'Board News' block is the ability to cutoff the content with a '...' if the post size exceeds a set number of characters or by using the [cutoff] BBC tag.

The three dots look a little boring, so here's a simple way to add a 'Read More' button after the '...' to make it look more traditional (and spiffier looking!).

All of the default portal blocks are in one file - \Sources\PortalBlock.php, which makes it easy to modify.

Look for the following in the \Sources\PortalBlocks.php file (around line 1369 in version 2.3.5):

Find:
Code: [Select]
		// Only place an ellipsis if the body has been shortened.
if ($limited)
$row['body'] .= '<a href="' . $scripturl . '?topic=' . $row['id_topic'] . '.0" title="' . $row['subject'] . '">...</a>';
Replace:
Code: [Select]
		// Only place an ellipsis if the body has been shortened. Modified with a READMORE button
if ($limited)
$row['body'] .= '<a href="' . $scripturl . '?topic=' . $row['id_topic'] . '.0" title="' . $row['subject'] . '">...<p><img src ="' . $settings['theme_url'] . '\images\readmore.gif" border = "0"></a>';

Note: The <p> after the ... is there to move the readmore.gif image down to a new 'paragraph', otherwise it would appear immediately after the three dots.

Download and save the 'readmore.gif' image (or use your own) and upload it to your current theme's image folder ('\Themes\default\images' if your using the default curve theme).

To see this mod in action, just checkout the home page of SMF Help - it's already being implemented.  8)

Other ideas for this mod is to use a little css to create a mouse hover effect and a sprite image with different visual 'states' of the button (normal, hover, depressed).
« Last Edit: June 27, 2014, 11:14:55 AM by Brian »

July 07, 2013, 05:41:53 PMReply #1

Offline Brian

  • Administrator
  • Jr. Member
  • *
  • Posts: 49
  • Country: us
  • Karma: 0
    • View Profile
Re: How to add a 'Read More' button to Board News in Simple Portal
« Reply #1 on: July 07, 2013, 05:41:53 PM »
The above modification only works with the 'Board News' block - but what if you wanted the same effect for Article blocks?  ;)

Open up the \Sources\PortalArticles.php and look for the following at around line 169:

Find:
Code: [Select]
	// Only place an ellipsis if the body has been shortened.
if ($limited)
$row['body'] .= '<a href="' . $scripturl . '?topic=' . $row['id_topic'] . '.0" title="' . $row['subject'] . '">...</a>';

Replace:
Code: [Select]
        // Only place an ellipsis if the body has been shortened. Modified with a READMORE button
        if ($limited)
            $row['body'] .= '<a href="' . $scripturl . '?topic=' . $row['id_topic'] . '.0" title="' . $row['subject'] . '">...<p><img src ="' . $settings['theme_url'] . '\images\readmore.gif" border = "0"></a>';

This requires the same readmore.gif image stored in the current theme's image folder.
« Last Edit: July 12, 2013, 05:41:49 AM by Brian »

Namecheap
 

HostGator
Use SMFHELP25OFF for 25% off!