Jump to content
IPSGoza

News Templates


  1. Adjusting URL to your site

    To make your news template work for your community, we need to adjust some links that points to your community.
    There are some areas you would need to change:
    News Article Display > record News Article Listing > categoryHead News Article > Index  

    Article Display
    Firstly, we'll start News Article Display > record.  At the top, you will noticed this code:
    <li><a href="{pageurl="news"}"><i class="fa fa-angle-left"></i> Blog Home</a></li> If your news page is called news then you don't have anything to worry about. But if your page is called differently then you'll want to change news to your page. What {pageurl="news"} mean is your site address (example: www.yoursite.com/{pageurl="news"}). News is whatever page name is called. 

    Article Listing
    Secondly, we'll start News Article Listing > categoryHead. At the top, you will noticed this code:
    <header class="cCmsDatabasePageHeader"> <div class="cCmsDatabasePageHeaderLogo"></div> <div class="ipsLayout_container"> <div class="ipsPadding"> <h1 class="ipsType_pageTitle">{$category->_title}</h1> <hr> <p class="ipsType_minorHeading">{$category->_description|raw}</p> </div> <nav class="cCmsDatabasePageHeader__nav"> <ul> <li {{if strpos( \IPS\Request::i()->path, '/news' ) !== FALSE}}class='cCmsDatabasePageHeader__navActive'{{endif}}> <a href="{pageurl="news"}">Recent</a> </li> <li {{if strpos( \IPS\Request::i()->path, 'news/ips' ) !== FALSE}}class='cCmsDatabasePageHeader__navActive'{{endif}}> <a href="{pageurl="news/ips"}">IPS</a> </li> <li {{if strpos( \IPS\Request::i()->path, 'news/other' ) !== FALSE}}class='cCmsDatabasePageHeader__navActive'{{endif}}> <a href="{pageurl="news/other"}">Other</a> </li> </ul> </nav> </div> </header> Again, as previously stated. If your site page is different than news, you can change it. If you have more categories in your news, you can add this code and adjust to your sites categories.
    <li {{if strpos( \IPS\Request::i()->path, 'news/other' ) !== FALSE}}class='cCmsDatabasePageHeader__navActive'{{endif}}> <a href="{pageurl="news/other"}">Other</a> </li>
    Article Index
    Thirdly, we'll start modifying News Article > Index. Again, at the top, you will notice this code. It very similar to the one above, but there's a slight different code. 
    <header class="cCmsDatabasePageHeader"> <div class="cCmsDatabasePageHeaderLogo"></div> <div class="ipsLayout_container"> <div class="ipsPadding"> <h1 class="ipsType_pageTitle"><a href="{pageurl="news"}">{$database->_title}</a></h1> {{if $database->_description}} <hr> <p class="ipsType_minorHeading">{$database->_description}</p> {{endif}} </div> <nav class="cCmsDatabasePageHeader__nav"> <ul> <li {{if strpos( \IPS\Request::i()->path, 'news' ) !== FALSE}}class='cCmsDatabasePageHeader__navActive'{{endif}}> <a href="{pageurl="news"}">Recent</a> </li> <li {{if strpos( \IPS\Request::i()->path, 'news/ips' ) !== FALSE}}class='cCmsDatabasePageHeader__navActive'{{endif}}> <a href="{pageurl="news/ips"}">IPS</a> </li> <li {{if strpos( \IPS\Request::i()->path, 'news/other' ) !== FALSE}}class='cCmsDatabasePageHeader__navActive'{{endif}}> <a href="{pageurl="news/other"}">Other</a> </li> </ul> </nav> </div> </header> If your page url is differently, then we'll need to change it. 

    Note
    In News Article Listing > categoryHead and News Article > Index, these code seems the same but they act differently. The first line of code, if you're not on news page then don't active and the second line of code, if your on news page use active code. This is somewhat of a workaround I have found it be activate when your on news page or not. 
    <li {{if strpos( \IPS\Request::i()->path, '/news' ) !== FALSE}}class='cCmsDatabasePageHeader__navActive'{{endif}}> <li {{if strpos( \IPS\Request::i()->path, 'news' ) !== FALSE}}class='cCmsDatabasePageHeader__navActive'{{endif}}>
  2. Adjusting background image placeholder

    You've just bought and installed News Database and wondering why there's no background images showing up if you're not using a cover image. Obvious, its trying to call a image when there's isn't one. There are few places you can upload an image on your website.
    Using the Page Management > media, you can upload an image and you can use the code there to display your placeholder image. Customization > Themes > Theme (dropdown) Manage resources > add image. Upload image through FTP on your server Lastly, copy image address you found on the internet. All the options will work but for simplicity, we'll stick with the first option as we're dealing with pages.  Go to Pages > Page Management > media > Upload new media. Once you have added your image, you want to click on the image and on the left side will appear, you will want to copy media tag. The media tag will represent the url to the image itself. 
    Now that we have our media tag, we want to head to Pages > Page Management > templates. There's 2 files we want to edit:
    News Article Display > record News Article Listing > recordRow News Article Display > record. If you see {media="4"} replace with your media number. If you're not using a media tag, just replace {media="4"} to whatever url is your placeholder image.
    <div class="cCmsRecordsArticleHeader" style="{{if $record->record_image}}background-image: url({file="$record->record_image" extension="cms_Records"}){{else}}background-image: url({media="4"}){{endif}}"> <div class="cCmsRecordsArticleHeader__height"></div> <nav class="cCmsRecordsArticleHeader__nav ipsLayout_container"> <ul> <li><a href="{pageurl="news"}"><i class="fa fa-angle-left"></i> Blog Home</a></li> <li><a href="{$record->container()->url()}">More in {$record->container()->_title}</a></li> </ul> </nav> </div> News Article Listing > recordRow. Same as before, replace media number with yours if your using media option but otherwise replace {media="4"} with your actual link to the placeholder image.
    <div class="cCmsCategoryFeaturedImage" style="{{if $row->record_image}}background-image: url({file="$row->record_image" extension="cms_Records"}){{else}}background-image: url({media="4"}){{endif}}"> {{if $row->record_image}} <img class="ipsImage" src="{file="$row->record_image" extension="cms_Records"}"> {{else}} <img class="ipsImage" src="{media="4"}"> {{endif}} </div> Edit our news css file. Replace media # or replace {media="4"} entirely to your URL of the image.
    .cCmsDatabasePageHeaderLogo { background-image: url({media="4"}); }  
×
×
  • Create New...