WebFlake is currently in the process of upgrading fully to IPS 4.2.
We are aware that various functions may not be working correctly, or missing entirely.
Please use our Bug Tracker and Suggestions Tracker to help us with this transition.

You can dismiss this message at your discretion. Thanks!

Jump to content
Music Case

Create You're Own Widget Locations

Recommended Posts

Music Case    10

In the midst of adding images for the code as well as a demo board for people to add widgets to multiple new block locations!

Hello,

So I have spent a long time tinkering with IPS4 in order to have more than the default 3 widget locations. I've always urged for a portal more like the one from IPS3.X so iv'e found a way to add your own widget locations.

This tutorial involved editing some important files and creating your own in the theme editor screen so it's a reasonably complex tutorial so i'd advise greatly to back your site up!

So before you spend ages reading here's what this tutorial will show you how to do:

Untitled.thumb.png.c6563a889047ff8b4f97933be2a3afef.png

Demo

Prerequisites:

Back up your website theme

Back up your websites files and database

Make a snapshot if possible (cPannel)

Firstly:

You need to go into your theme editor and edit some lines of your globalTemplate, I would advise copying the original code into a notepad just in case it goes wrong, but you should already of backed up your theme anyways.

Around mid way down, depending on theme you'll find these the lines (they might be together or separated across a few lines):

{template="widgetContainer" group="global" app="core" params="'header', 'horizontal'"}
{template="widgetContainer" group="global" app="core" params="'footer', 'horizontal'"}
{template="sidebar" if="theme.sidebar_position == 'right'" app="core" group="global" params="'right'"}

Now you want to copy one or multiple of these lines depending on what you're trying to accomplish. For tutorial reason i'm going to add 2 sidebars, so copy:

{template="sidebar" if="theme.sidebar_position == 'right'" app="core" group="global" params="'right'"}
{template="sidebar_two" if="theme.sidebar_position == 'right'" app="core" group="global" params="'right'"}

and paste it underneath the original and change the {template="sidebar"..... to {template="sidebar_two".... and now save your globalTemplate.

Secondly:

Now stay in the theme editor and add a new HTML template, name it sidebar_two or corresponding to what you named the new widget.

Make sure the drop down menus are as follows:

Location: Front

Existing Group: Global

Applications: System

and now insert the "sidebar" template code into there and change are the sidebar tags as your widget name, in this case sidebar_two

{{if (isset( \IPS\Output::i()->sidebar['enabled'] ) and \IPS\Output::i()->sidebar['enabled'] ) && ( ( isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== '' ) || ( isset( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) && count( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) ) || ( \IPS\Dispatcher::i()->application instanceof \IPS\Application AND \IPS\Dispatcher::i()->application->canManageWidgets() ) )}}
	<div id='ipsLayout_sidebar' class='ipsLayout_sidebar{$position} {{if !( isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== '' ) && ( !isset( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) || !count( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) ) && \IPS\Dispatcher::i()->application->canManageWidgets()}}ipsLayout_sidebarUnused{{endif}}' data-controller='core.front.widgets.sidebar'>
		{{if isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== ''}}
			<aside id="elContextualTools" class='ipsClearfix' {{if isset( \IPS\Output::i()->sidebar['sticky'] )}}data-ipsSticky{{endif}}>
				{expression="\IPS\Output::i()->sidebar['contextual']" raw="true"}
			</aside>
		{{endif}}
		{{if isset(\IPS\Output::i()->sidebar['widgets']['sidebar']) and count( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) and ( \IPS\core\Advertisement::loadByLocation( 'ad_sidebar' ) ) }}
			{advertisement="ad_sidebar"}
			<br><br>
		{{endif}}
		{template="widgetContainer" group="global" app="core" params="'sidebar', 'vertical'"}
	</div>
{{endif}}

Thirdly:

Now you need to edit a system file, which you can do on your desktop then overwrite the file or you can do on cPannel file explorer as i have cPannel i'll be doing it in there, I STRONGLY advise you back this file up, editing this file incorrectly will result in none of your widgets working!

Navigate to:

Applications >> Core >> Modules >> Front >> System >> and edit Widgets.php

On these lines add your widget name:

Line: 33

if ( ! \IPS\Member::loggedIn()->modPermission('can_manage_sidebar', 'can_manage_WIDGET NAME')

Line 35:

\IPS\Output::i()->error( 'no_permission_manage_sidebar', 'no_permission_manage_WIDGET NAME', '3S172/1', 403, '' );

Line 75:

if ( ! $block->isExecutableByApp( array( \IPS\Request::i()->pageApp, 'sidebar', 'WIDGET NAME' ) ) )

Line 236: 

if( !in_array( \IPS\Request::i()->area, array( 'sidebar', 'WIDGET NAME' , 'header', 'footer' ) ) )

once you have made those changes save the widgets.php and overwrite the file.

Now when you go back to your home page and try to insert blocks into the new widgets it should work without any errors and save the locations!

Finally:

This is hugely variable between widgets youv'e chosen and widget locations.

However you can move the original:

{template="sidebar_two" if="theme.sidebar_position == 'right'" app="core" group="global" params="'right'"}

To wherever you want the widget to be on your site, you may need to also do some CSS edits.

BUGS:

So because default IPS only have 3 blocks 1 is which is sidebar, in your theme settings it will ask where  you want your sidebar (left or right) this is kinda of obsolete now as you can put it wherever you want.

The blocks do mobile friendly rather well, however left blocks will appear on top of the side and right blocks will appear at the bottom.

  • Like 1

Share this post


Link to post
Share on other sites
mr-pimpen    22

can you  x-splain this a little more better because when doing this it dont really tell what to remove what to do here in these lines what i'm asking is what do you remove  in Widgets.php what is in there know or just add it under the codes all ready every thing else i did there

 Applications >> Core >> Modules >> Front >> System >> and edit Widgets.php

On these lines add your widget name:

Line: 33

if ( ! \IPS\Member::loggedIn()->modPermission('can_manage_sidebar', 'can_manage_WIDGET NAME')

Line 35:

\IPS\Output::i()->error( 'no_permission_manage_sidebar', 'no_permission_manage_WIDGET NAME', '3S172/1', 403, '' );

Line 75:

if ( ! $block->isExecutableByApp( array( \IPS\Request::i()->pageApp, 'sidebar', 'WIDGET NAME' ) ) )

Line 236: 

if( !in_array( \IPS\Request::i()->area, array( 'sidebar', 'WIDGET NAME' , 'header', 'footer' ) ) )

once you have made those changes save the widgets.php and overwrite the file. 

 

Share this post


Link to post
Share on other sites
Music Case    10
4 hours ago, mr-pimpen said:

can you  x-splain this a little more better because when doing this it dont really tell what to remove what to do here in these lines what i'm asking is what do you remove  in Widgets.php what is in there know or just add it under the codes all ready every thing else i did there

 Applications >> Core >> Modules >> Front >> System >> and edit Widgets.php

On these lines add your widget name:

Line: 33

if ( ! \IPS\Member::loggedIn()->modPermission('can_manage_sidebar', 'can_manage_WIDGET NAME')

Line 35:

\IPS\Output::i()->error( 'no_permission_manage_sidebar', 'no_permission_manage_WIDGET NAME', '3S172/1', 403, '' );

Line 75:

if ( ! $block->isExecutableByApp( array( \IPS\Request::i()->pageApp, 'sidebar', 'WIDGET NAME' ) ) )

Line 236: 

if( !in_array( \IPS\Request::i()->area, array( 'sidebar', 'WIDGET NAME' , 'header', 'footer' ) ) )

once you have made those changes save the widgets.php and overwrite the file. 

 

you dont have to remove anything in these lines, you just gotta add your new widget location's name.... 

for example on line 33:

if ( ! \IPS\Member::loggedIn()->modPermission('can_manage_sidebar', 'can_manage_WIDGET NAME')

in bold is the part you need to add, same for the other lines, obviously you need to change WIDGET NAME to whatever you called it in previous steps.

PM me a if you want me to have a lil look at your site.

Share this post


Link to post
Share on other sites

@Music Case

I followed your instructions and was not that hard, but I am not sure if I did the... sidebar_two template file code (tags) correctly. I am attaching an RTF file with the code for u to verify if correct or incorrect. This website software is forbidding me from posting it with code.

If u could verify that the code is correct, if not fix so that I can use please. Thank u for your time

 

Sidebar_two_template.rtf

Share this post


Link to post
Share on other sites
Music Case    10
On 07/10/2017 at 2:42 AM, DarkSinister said:

@Music Case

I followed your instructions and was not that hard, but I am not sure if I did the... sidebar_two template file code (tags) correctly. I am attaching an RTF file with the code for u to verify if correct or incorrect. This website software is forbidding me from posting it with code.

If u could verify that the code is correct, if not fix so that I can use please. Thank u for your time

 

Sidebar_two_template.rtf

Sorry bro been away from internet for a week or so I'll be home tomorrow evening and I'll be happy to help.

Share this post


Link to post
Share on other sites

Either way, your modification DOES NOT work. If that file I attached has the tags that I did, wrong, that could be the problem, but if its ok, then your modification steps DO NO work.

If u could double check my attached file to make sure I did the tags correctly, cause that might be were it is wrong.

Thanks :smiley_z:

Edited by Davlin
Stop the drama. No user here is obligated to provide you with support. Last warning.

Share this post


Link to post
Share on other sites
Music Case    10
13 hours ago, DarkSinister said:

Either way, your modification DOES NOT work. If that file I attached has the tags that I did, wrong, that could be the problem, but if its ok, then your modification steps DO NO work.

If u could double check my attached file to make sure I did the tags correctly, cause that might be were it is wrong.

Thanks :smiley_z:

this is an exact copy of the code i use just edited for your purpose:

{{if (isset( \IPS\Output::i()->sidebar['enabled'] ) and \IPS\Output::i()->sidebar['enabled'] ) && ( ( isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== '' ) || ( isset( \IPS\Output::i()->sidebar['widgets']['sidebar_two'] ) && count( \IPS\Output::i()->sidebar['widgets']['sidebar_two'] ) ) || ( \IPS\Dispatcher::i()->application instanceof \IPS\Application AND \IPS\Dispatcher::i()->application->canManageWidgets() ) )}}
	<div id='ipsLayout_sidebar_two' class='ipsSidebar_two ipsLayout_sidebar_two{$position} {{if !( isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== '' ) && ( !isset( \IPS\Output::i()->sidebar['widgets']['sidebar_two'] ) || !count( \IPS\Output::i()->sidebar['widgets']['sidebar_two'] ) ) && \IPS\Dispatcher::i()->application->canManageWidgets()}}ipsLayout_sidebarUnused{{endif}}' data-controller='core.front.widgets.sidebar_two'>
		{{if isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== ''}}
			<aside id="elContextualTools" class='ipsClearfix' {{if isset( \IPS\Output::i()->sidebar['sticky'] )}}data-ipsSticky{{endif}}>
				{expression="\IPS\Output::i()->sidebar['contextual']" raw="true"}
			</aside>
		{{endif}}
		{{if isset(\IPS\Output::i()->sidebar['widgets']['sidebar_two']) and count( \IPS\Output::i()->sidebar['widgets']['sidebar_two'] ) and ( \IPS\core\Advertisement::loadByLocation( 'ad_sidebar' ) ) }}
			{advertisement="ad_sidebar"}
			<br><br>
		{{endif}}
		{template="widgetContainer" group="global" app="core" params="'sidebar_two', 'vertical'"}
	</div>
{{endif}}

if you're needing any help just lemme know you're more than welcome to pop up in PM!

Share this post


Link to post
Share on other sites
What do you think? Remember the human.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


  • Recently Browsing   0 members

    No registered users viewing this page.

×