Jump to content

Any tutorial for Pages to create nice portal


Recommended Posts

I believe @Aiwa had created nice block/addon for IP.Content for IPS 3.4.x. Is their something like below exist for IPS 4.x pages? 

Screenshot from my old IPS 3.4.x website - https://www.screencast.com/t/At8pjtzn

Announcement block will pull data from selected category and will truncate to limited lines. It would be nice to have something like that in IPS 4.x Any help is appreciated.


Link to comment
Share on other sites

It’s pretty much drag and drop now in 4.x. No tutorial needed. You just drag widgets in places you like them to be. Make sure your homepage is a “Page Builder” page though to have drag&drop functionality. Converted pages from IP.Content don’t work this way. 

Link to comment
Share on other sites

  • 2 weeks later...

The only thing 'special' about that page is the news feed which is just a couple tweaks on a generic feed block.  Otherwise it's a simple page with a couple feeds.

Here's the 'content' for the news block.  I wrote it a LONG time ago for my own use, so excuse some of the hackyness.

{{if !empty( $topics ) }}
<!-- CSS Styles for the Date -->
#kc_date_wrap { line-height: 1.5; padding-right: 40px;}
.kc_date_day { font: 300 60px/40px 'Helvetica Neue', helvetica, arial, sans-serif; text-align: center; padding-right: 10px;}
.kc_date_monthyear { 
	text-transform: uppercase;
	font-size: 16px;
         padding-right: 10px;

	{{foreach $topics as $topic}}
		<div class='ipsBox ipsSpacer_bottom'>
			<h3 class='ipsType_sectionTitle'>
				<a href='{$topic->url()}' {{if $topic->canView()}}data-ipsHover data-ipsHover-target='{$topic->url()->setQueryString('preview', 1)}' data-ipsHover-timeout='1.5' {{endif}}> {wordbreak="$topic->mapped('title')"}
				<span class='ipsType_reset ipsType_medium ipsType_light'>
							{lang="byline" htmlsprintf="$topic->author()->link()"} {datetime="$topic->mapped('date')"}
				<div class="ipsCommentCount ipsPos_right {{if ( $topic->posts - 1 ) === 0}}ipsFaded{{endif}}" data-ipsTooltip title='{lang="replies_number" pluralize="$topic->posts - 1"}'>{expression="$topic->posts - 1"}</div>
			<div class='ipsPad'>
				<!-- Large Date -->
				<div class='kc_date_wrap' style="float: left; text-align: center;">
				    <span class='kc_date_day'>{expression="\IPS\DateTime::ts($topic->mapped('date'))->strFormat( '%e' )"}</span><br />
				    <span class='kc_date_monthyear'>{expression="\IPS\DateTime::ts($topic->mapped('date'))->strFormat( '%b %G' )"}</span>
					<div class='ipsType_normal ipsType_richText' data-ipsTruncate data-ipsTruncate-size="10 lines">
						<span class=''>{$topic->content()|raw}</span>



Link to comment
Share on other sites

26 minutes ago, AlexJ said:

How do I make a layout something like this?

That’s not a directly supported layout. You would have to code that manually from scratch and of course also deal with the responsiveness yourself. 

You can however set the main column to have 1, 2, or 3 colums as option of Page Builder pages. 

Link to comment
Share on other sites


This topic is now archived and is closed to further replies.

  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...