Jump to content

Chocolate theme navigation bar icon issue!


Mr.Aces

Recommended Posts

It's more than likely due to;

ipsNavBar_active

As it only happens when you hover or have an active item

Edited by Jeffrey
  • Support Team - September 9th, 2017 - June 8, 2018
  • Junior Moderator - December 14th 2018 - November 16th, 2019
  • Designer - November 16th, 2019 - June 5th, 2020
  • Moderator - June 5th, 2020 - August 28th, 2020
Link to comment
Share on other sites

7 hours ago, TO_ProLeague said:

I want to show the icon in-line with text after it. I will be very thankful if someone helps me. Thanks! ?

  Hide contents

 

ADD THIS TO CSS

/* Primary Menu */
.ipsNavBar_primary > ul > li > a:before,
.ipsNavBar_secondary > li > a:before{
content: "\f00b";
font-family: "FontAwesome";
font-size: 10px;
font-weight: normal;
display: inline-block;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin-bottom: -2px;
margin-right: 3px;
opacity: 0.6;
line-height: 1;
}



/* The User menu and Create */
#elUserLink_menu a:before,
#elCreateNew_menu a:before{
content: "\f02b";
font-family: "FontAwesome";
font-size: 14px;
font-weight: normal;
display: inline-block;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin-bottom: -2px;
line-height: 1;
}

#elUserLink_menu a[href*="admin"] i{
display: none;
}

#elUserLink_menu a:before,
#elCreateNew_menu a:before{
display: inline-block;
width: 22px;
opacity: 0.7;
}

#elUserLink_menu a:hover:before,
#elCreateNew_menu a:hover:before{
opacity: 1;
}

/* Add Icon on the primary navigation bar */
.ipsNavBar_primary > ul > li[data-FontAwesome='Browse'] > a:before{ content: "\f005" }
.ipsNavBar_primary > ul > li[data-FontAwesome='club'] > a:before{ content: "\f1b3" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Support'] > a:before{ content: "\f1cd" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Forums'] > a:before{ content: "\f086" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Gallery'] > a:before{ content: "\f030" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Downloads'] > a:before{ content: "\f019" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Articles'] > a:before{ content: "\f15c" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Blogs'] > a:before{ content: "\f02d" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Calendar'] > a:before{ content: "\f073" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Chat'] > a:before{ content: "\f27a" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Staff'] > a:before{ content: "\f007" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Users Online'] > a:before{ content: "\f0c0" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Activity'] > a:before{ content: "\f0ac" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Search'] > a:before{ content: "\f002" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Guidelines'] > a:before{ content: "\f0e3" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Tutorials'] > a:before{ content: "\f19d" }

/* Add Icon on the secondary navigation bar */
.ipsNavBar_secondary > li[data-FontAwesome='Browse'] > a:before{ content: "\f00b" }
.ipsNavBar_secondary > li[data-FontAwesome='club'] > a:before{ content: "\f1b3" }
.ipsNavBar_secondary > li[data-FontAwesome='Support'] > a:before{ content: "\f1cd" }
.ipsNavBar_secondary > li[data-FontAwesome='Forums'] > a:before{ content: "\f086" }
.ipsNavBar_secondary > li[data-FontAwesome='Gallery'] > a:before{ content: "\f030" }
.ipsNavBar_secondary > li[data-FontAwesome='Downloads'] > a:before{ content: "\f019" }
.ipsNavBar_secondary > li[data-FontAwesome='Articles'] > a:before{ content: "\f15c" }
.ipsNavBar_secondary > li[data-FontAwesome='Blogs'] > a:before{ content: "\f02d" }
.ipsNavBar_secondary > li[data-FontAwesome='Calendar'] > a:before{ content: "\f073" }
.ipsNavBar_secondary > li[data-FontAwesome='Chat'] > a:before{ content: "\f27a" }
.ipsNavBar_secondary > li[data-FontAwesome='Online Users'] > a:before{ content: "\f0c0" }
.ipsNavBar_secondary > li[data-FontAwesome='Activity'] > a:before{ content: "\f0ac" }
.ipsNavBar_secondary > li[data-FontAwesome='Search'] > a:before{ content: "\f002" }
.ipsNavBar_secondary > li[data-FontAwesome='Todays Activities'] > a:before{ content: "\f06e" }
.ipsNavBar_secondary > li[data-FontAwesome='My Searches'] > a:before{ content: "\f00e" }
.ipsNavBar_secondary > li[data-FontAwesome='Unread Content'] > a:before{ content: "\f111" }
.ipsNavBar_secondary > li[data-FontAwesome='My Created Content'] > a:before{ content: "\f005" }
.ipsNavBar_secondary > li[data-FontAwesome='Guidelines'] > a:before{ content: "\f0e3" }
.ipsNavBar_secondary > li[data-FontAwesome='Tutorials'] > a:before{ content: "\f19d" }
.ipsNavBar_secondary > li[data-FontAwesome='Staff'] > a:before{ content: "\f132" }

/* Add Icon on the user bar */

/* Profile */
#elUserLink_menu > li[data-menuItem='profile'] > a:before{ content: "\f007" }

/* Attachments */
#elUserLink_menu > li[data-menuItem='attachments'] > a:before{ content: "\f0c6" }

/* Followed Content */
#elUserLink_menu > li[data-menuItem='manageFollowed'] > a:before{ content: "\f1d8" }

/* Administrator Panel */
#elUserLink_menu > li[data-menuItem='content'] > a:before{ content: "\f03a" }

/* Account Configurations */
#elUserLink_menu > li[data-menuItem='settings'] > a:before{ content: "\f013" }

/* Mod Panel */
#elUserLink_menu > li[data-menuItem='modcp'] > a:before{ content: "\f132" }

/* Admin Panel */
#elUserLink_menu > li[data-menuItem='admincp'] > a:before{ content: "\f023" }

/* Logout */
#elUserLink_menu > li[data-menuItem='signout'] > a:before{ content: "\f08b" }

/* Clients */
#elUserLink_menu a[href*="/clients/"]:before{ content: "\f07a" }

/* Edit */
#elUserLink_menu > li[data-menuItem='edit'] > a:before{ content: "\f040" }

/* Ignored Users */
#elUserLink_menu > li[data-menuItem='ignoredUsers'] > a:before{ content: "\f235" }

/* Options */
#elUserLink_menu > li[data-menuItem='options'] > a:before{ content: "\f0ac" }

/* Messages */
#elUserLink_menu > li[data-menuItem='messages'] > a:before{ content: "\f01c" }

/* Add Icon on create bar */

/* Default icon that is displayed if you do not add */
#elCreateNew_menu a:before{ content: "\f0fe" }

/* Announcement */
#elCreateNew_menu a[href*="/announcements/"]:before{ content: "\f0a1" }

/* Update Status */
#elCreateNew_menu a[href*="module=status"]:before{ content: "\f021" }

/* Member Notes */
#elCreateNew_menu a[href*="module=notes"]:before{ content: "\f14b" }

/* IPS Downloads */
#elCreateNew_menu a[href*="/files/"]:before { content:"\f019" }

/* IPS Gallery */
#elCreateNew_menu a[href*="/gallery/"]:before { content:"\f030" }

/* IPS Blogs */
#elCreateNew_menu a[href*="/blogs/"]:before { content:"\f02d" }

/* Tutorials */
#elCreateNew_menu a[href*="/tutorials/"]:before { content:"\f19d" }

/* IPS Calendar*/
#elCreateNew_menu a[href*="/calendar/"]:before { content:"\f073" }

/* IPS Articles */
#elCreateNew_menu a[href*="/articles"]:before { content:"\f0f6" }

/* Create new topic , I stopped two ways to work if the forum has at the root folder or forum*/
#elCreateNew_menu a[href*="/index.php?/submit/"]:before { content:"\f075" }
#elCreateNew_menu a[href*="/forums/"]:before { content:"\f075" }
#elCreateNew_menu a[href*="/index.php?/submit/"]:before { content:"\f075" }

add this to navrbaritem

{{$first = TRUE;}}
{{foreach $roots as $id => $item}}
	{{if $preview or $item->canView()}}
		{{$active = $item->activeOrChildActive();}}
		{{if $active}}
			{{\IPS\core\FrontNavigation::i()->activePrimaryNavBar = $item->id;}}
		{{endif}}
		<li {{if $active}}class='ipsNavBar_active' data-active{{endif}} id='elNavSecondary_{$item->id}' data-role="navBarItem" data-navApp="{expression="mb_substr( get_class( $item ), 4, mb_strpos( get_class( $item ), '\\', 4 ) - 4 )"}" data-navExt="{expression="mb_substr( get_class( $item ), mb_strrpos( get_class( $item ), '\\' ) + 1 )"}" data-navTitle="{$item->title()} "data-FontAwesome="{$item->title()}">
			{{$children = $item->children();}}
			{{if $children}}
				<a href="{{if $item->link()}}{$item->link()}{{else}}#{{endif}}" id="elNavigation_{$id}" data-ipsMenu data-ipsMenu-appendTo='#{{if $parent}}elNavSecondary_{$parent}{{else}}elNavSecondary_{$id}{{endif}}' data-ipsMenu-activeClass='ipsNavActive_menu' data-navItem-id="{$item->id}" {{if $active}}data-navDefault{{endif}}>
					{$item->title()} <i class="fa fa-caret-down"></i>
				</a>
				<ul id="elNavigation_{$id}_menu" class="ipsMenu ipsMenu_auto ipsHide">
					{template="navBarChildren" app="core" group="global" location="front" params="$children, $preview"}
				</ul>
			{{else}}
				<a href="{{if $item->link()}}{$item->link()}{{else}}#{{endif}}" {{if method_exists( $item, 'target' ) AND $item->target()}}target='{$item->target()}'{{endif}} data-navItem-id="{$item->id}" {{if $active}}data-navDefault{{endif}} {{if $subBars && isset( $subBars[ $id ] ) && count( $subBars[ $id ] )}}data-hover=''{{endif}}>
					{$item->title()}
				</a>
			{{endif}}
			{{if $subBars && isset( $subBars[ $id ] ) && count( $subBars[ $id ] )}}
				<ul class='ipsNavBar_secondary {{if !$active}}ipsHide{{endif}}' data-role='secondaryNavBar'>
					{template="navBarItems" app="core" group="global" location="front" params="$subBars[ $id ], NULL, $item->id, $preview"}
					<li class='ipsHide' id='elNavigationMore_{$id}' data-role='navMore'>
						<a href='#' data-ipsMenu data-ipsMenu-appendTo='#elNavigationMore_{$id}' id='elNavigationMore_{$id}_dropdown'>{lang="more"} <i class='fa fa-caret-down'></i></a>
						<ul class='ipsHide ipsMenu ipsMenu_auto' id='elNavigationMore_{$id}_dropdown_menu' data-role='moreDropdown'></ul>
					</li>
				</ul>
			{{endif}}
		</li>
	{{endif}}
{{endforeach}}

 

when I load your site, I was like a vampire, slept for thousands of years and just now is my first glimpse of light haha.

Link to comment
Share on other sites

2 hours ago, Cookie Monster said:

So your trying to do something like I done here ?

https://codepen.io/Eventyret/pen/mGbZQp

Targeting the After on hover ?

Nope. I want the icon on hover should be like this: download.png.80c50a7747af42680edfa4916557041d.png

Not like this: 1748691476_download(1).png.33c1e2739225a7721b90b27513c3606b.png  (Currently I'm viewing like this) ?

Link to comment
Share on other sites

21 minutes ago, TO_ProLeague said:

Nope. I want the icon on hover should be like this: download.png.80c50a7747af42680edfa4916557041d.png

 Not like this: 1748691476_download(1).png.33c1e2739225a7721b90b27513c3606b.png  (Currently I'm viewing like this) ?

I would guess you need to give it a inline-block and not a block for the CSS then

VAEfvMI.png

Liked what i posted remember to feed me a cookie ->
Or you can add a cookie to myCookieJar

Link to comment
Share on other sites

Spoiler
On 8/20/2018 at 8:24 AM, mr-pimpen said:

ADD THIS TO CSS



/* Primary Menu */
.ipsNavBar_primary > ul > li > a:before,
.ipsNavBar_secondary > li > a:before{
content: "\f00b";
font-family: "FontAwesome";
font-size: 10px;
font-weight: normal;
display: inline-block;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin-bottom: -2px;
margin-right: 3px;
opacity: 0.6;
line-height: 1;
}



/* The User menu and Create */
#elUserLink_menu a:before,
#elCreateNew_menu a:before{
content: "\f02b";
font-family: "FontAwesome";
font-size: 14px;
font-weight: normal;
display: inline-block;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin-bottom: -2px;
line-height: 1;
}

#elUserLink_menu a[href*="admin"] i{
display: none;
}

#elUserLink_menu a:before,
#elCreateNew_menu a:before{
display: inline-block;
width: 22px;
opacity: 0.7;
}

#elUserLink_menu a:hover:before,
#elCreateNew_menu a:hover:before{
opacity: 1;
}

/* Add Icon on the primary navigation bar */
.ipsNavBar_primary > ul > li[data-FontAwesome='Browse'] > a:before{ content: "\f005" }
.ipsNavBar_primary > ul > li[data-FontAwesome='club'] > a:before{ content: "\f1b3" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Support'] > a:before{ content: "\f1cd" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Forums'] > a:before{ content: "\f086" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Gallery'] > a:before{ content: "\f030" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Downloads'] > a:before{ content: "\f019" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Articles'] > a:before{ content: "\f15c" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Blogs'] > a:before{ content: "\f02d" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Calendar'] > a:before{ content: "\f073" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Chat'] > a:before{ content: "\f27a" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Staff'] > a:before{ content: "\f007" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Users Online'] > a:before{ content: "\f0c0" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Activity'] > a:before{ content: "\f0ac" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Search'] > a:before{ content: "\f002" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Guidelines'] > a:before{ content: "\f0e3" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Tutorials'] > a:before{ content: "\f19d" }

/* Add Icon on the secondary navigation bar */
.ipsNavBar_secondary > li[data-FontAwesome='Browse'] > a:before{ content: "\f00b" }
.ipsNavBar_secondary > li[data-FontAwesome='club'] > a:before{ content: "\f1b3" }
.ipsNavBar_secondary > li[data-FontAwesome='Support'] > a:before{ content: "\f1cd" }
.ipsNavBar_secondary > li[data-FontAwesome='Forums'] > a:before{ content: "\f086" }
.ipsNavBar_secondary > li[data-FontAwesome='Gallery'] > a:before{ content: "\f030" }
.ipsNavBar_secondary > li[data-FontAwesome='Downloads'] > a:before{ content: "\f019" }
.ipsNavBar_secondary > li[data-FontAwesome='Articles'] > a:before{ content: "\f15c" }
.ipsNavBar_secondary > li[data-FontAwesome='Blogs'] > a:before{ content: "\f02d" }
.ipsNavBar_secondary > li[data-FontAwesome='Calendar'] > a:before{ content: "\f073" }
.ipsNavBar_secondary > li[data-FontAwesome='Chat'] > a:before{ content: "\f27a" }
.ipsNavBar_secondary > li[data-FontAwesome='Online Users'] > a:before{ content: "\f0c0" }
.ipsNavBar_secondary > li[data-FontAwesome='Activity'] > a:before{ content: "\f0ac" }
.ipsNavBar_secondary > li[data-FontAwesome='Search'] > a:before{ content: "\f002" }
.ipsNavBar_secondary > li[data-FontAwesome='Todays Activities'] > a:before{ content: "\f06e" }
.ipsNavBar_secondary > li[data-FontAwesome='My Searches'] > a:before{ content: "\f00e" }
.ipsNavBar_secondary > li[data-FontAwesome='Unread Content'] > a:before{ content: "\f111" }
.ipsNavBar_secondary > li[data-FontAwesome='My Created Content'] > a:before{ content: "\f005" }
.ipsNavBar_secondary > li[data-FontAwesome='Guidelines'] > a:before{ content: "\f0e3" }
.ipsNavBar_secondary > li[data-FontAwesome='Tutorials'] > a:before{ content: "\f19d" }
.ipsNavBar_secondary > li[data-FontAwesome='Staff'] > a:before{ content: "\f132" }

/* Add Icon on the user bar */

/* Profile */
#elUserLink_menu > li[data-menuItem='profile'] > a:before{ content: "\f007" }

/* Attachments */
#elUserLink_menu > li[data-menuItem='attachments'] > a:before{ content: "\f0c6" }

/* Followed Content */
#elUserLink_menu > li[data-menuItem='manageFollowed'] > a:before{ content: "\f1d8" }

/* Administrator Panel */
#elUserLink_menu > li[data-menuItem='content'] > a:before{ content: "\f03a" }

/* Account Configurations */
#elUserLink_menu > li[data-menuItem='settings'] > a:before{ content: "\f013" }

/* Mod Panel */
#elUserLink_menu > li[data-menuItem='modcp'] > a:before{ content: "\f132" }

/* Admin Panel */
#elUserLink_menu > li[data-menuItem='admincp'] > a:before{ content: "\f023" }

/* Logout */
#elUserLink_menu > li[data-menuItem='signout'] > a:before{ content: "\f08b" }

/* Clients */
#elUserLink_menu a[href*="/clients/"]:before{ content: "\f07a" }

/* Edit */
#elUserLink_menu > li[data-menuItem='edit'] > a:before{ content: "\f040" }

/* Ignored Users */
#elUserLink_menu > li[data-menuItem='ignoredUsers'] > a:before{ content: "\f235" }

/* Options */
#elUserLink_menu > li[data-menuItem='options'] > a:before{ content: "\f0ac" }

/* Messages */
#elUserLink_menu > li[data-menuItem='messages'] > a:before{ content: "\f01c" }

/* Add Icon on create bar */

/* Default icon that is displayed if you do not add */
#elCreateNew_menu a:before{ content: "\f0fe" }

/* Announcement */
#elCreateNew_menu a[href*="/announcements/"]:before{ content: "\f0a1" }

/* Update Status */
#elCreateNew_menu a[href*="module=status"]:before{ content: "\f021" }

/* Member Notes */
#elCreateNew_menu a[href*="module=notes"]:before{ content: "\f14b" }

/* IPS Downloads */
#elCreateNew_menu a[href*="/files/"]:before { content:"\f019" }

/* IPS Gallery */
#elCreateNew_menu a[href*="/gallery/"]:before { content:"\f030" }

/* IPS Blogs */
#elCreateNew_menu a[href*="/blogs/"]:before { content:"\f02d" }

/* Tutorials */
#elCreateNew_menu a[href*="/tutorials/"]:before { content:"\f19d" }

/* IPS Calendar*/
#elCreateNew_menu a[href*="/calendar/"]:before { content:"\f073" }

/* IPS Articles */
#elCreateNew_menu a[href*="/articles"]:before { content:"\f0f6" }

/* Create new topic , I stopped two ways to work if the forum has at the root folder or forum*/
#elCreateNew_menu a[href*="/index.php?/submit/"]:before { content:"\f075" }
#elCreateNew_menu a[href*="/forums/"]:before { content:"\f075" }
#elCreateNew_menu a[href*="/index.php?/submit/"]:before { content:"\f075" }

add this to navrbaritem



{{$first = TRUE;}}
{{foreach $roots as $id => $item}}
	{{if $preview or $item->canView()}}
		{{$active = $item->activeOrChildActive();}}
		{{if $active}}
			{{\IPS\core\FrontNavigation::i()->activePrimaryNavBar = $item->id;}}
		{{endif}}
		<li {{if $active}}class='ipsNavBar_active' data-active{{endif}} id='elNavSecondary_{$item->id}' data-role="navBarItem" data-navApp="{expression="mb_substr( get_class( $item ), 4, mb_strpos( get_class( $item ), '\\', 4 ) - 4 )"}" data-navExt="{expression="mb_substr( get_class( $item ), mb_strrpos( get_class( $item ), '\\' ) + 1 )"}" data-navTitle="{$item->title()} "data-FontAwesome="{$item->title()}">
			{{$children = $item->children();}}
			{{if $children}}
				<a href="{{if $item->link()}}{$item->link()}{{else}}#{{endif}}" id="elNavigation_{$id}" data-ipsMenu data-ipsMenu-appendTo='#{{if $parent}}elNavSecondary_{$parent}{{else}}elNavSecondary_{$id}{{endif}}' data-ipsMenu-activeClass='ipsNavActive_menu' data-navItem-id="{$item->id}" {{if $active}}data-navDefault{{endif}}>
					{$item->title()} <i class="fa fa-caret-down"></i>
				</a>
				<ul id="elNavigation_{$id}_menu" class="ipsMenu ipsMenu_auto ipsHide">
					{template="navBarChildren" app="core" group="global" location="front" params="$children, $preview"}
				</ul>
			{{else}}
				<a href="{{if $item->link()}}{$item->link()}{{else}}#{{endif}}" {{if method_exists( $item, 'target' ) AND $item->target()}}target='{$item->target()}'{{endif}} data-navItem-id="{$item->id}" {{if $active}}data-navDefault{{endif}} {{if $subBars && isset( $subBars[ $id ] ) && count( $subBars[ $id ] )}}data-hover=''{{endif}}>
					{$item->title()}
				</a>
			{{endif}}
			{{if $subBars && isset( $subBars[ $id ] ) && count( $subBars[ $id ] )}}
				<ul class='ipsNavBar_secondary {{if !$active}}ipsHide{{endif}}' data-role='secondaryNavBar'>
					{template="navBarItems" app="core" group="global" location="front" params="$subBars[ $id ], NULL, $item->id, $preview"}
					<li class='ipsHide' id='elNavigationMore_{$id}' data-role='navMore'>
						<a href='#' data-ipsMenu data-ipsMenu-appendTo='#elNavigationMore_{$id}' id='elNavigationMore_{$id}_dropdown'>{lang="more"} <i class='fa fa-caret-down'></i></a>
						<ul class='ipsHide ipsMenu ipsMenu_auto' id='elNavigationMore_{$id}_dropdown_menu' data-role='moreDropdown'></ul>
					</li>
				</ul>
			{{endif}}
		</li>
	{{endif}}
{{endforeach}}

 

 

@GuguGRP Follow this guide!

Edited by TO_ProLeague
Link to comment
Share on other sites

On 8/26/2018 at 4:58 PM, GuguGRP said:

Mine was like this. How do I solve it?

Screenshot_4.png

Either A) Give more information and stop highjack the thread, or B) Create your own thread with your question and your screenshot. I can't really seem to understand how this was relevant @GuguGRP

VAEfvMI.png

Liked what i posted remember to feed me a cookie ->
Or you can add a cookie to myCookieJar

Link to comment
Share on other sites

  • 2 weeks later...

there are some issues with that them i found this on ipb if you run in to issues with blocks

✔️ Missing slider image
✔️ Choosing "which slider"
✔️ Moving lines color (particles)
✔️ Footer links height

 

 

As the blocks code can't be updated through theme, You must update the block code manually.

Page Management --> Blocks --> Edit Block top articles  --> Content (Tab)

Replace all code with this one:

 

{{if theme.ch_theme_slider_on}}
{{if theme.cc_theme_slider_permissions =='*' || \IPS\Member::loggedIn()->inGroup( explode( ',', theme.cc_theme_slider_permissions ) )}}
{{if theme.cc_theme_slider_place == '*'}}
<div class='cCpage_intro ipsClearfix'>
<div class='cCpage_intro_slider_db'>

<div class="theme_intro_slider theme_intro_slider_db">
{{foreach $records as $record}}
<div class='imgSlider' style='background-image: url({file="$record->_record_image_thumb" extension="cms_Records"});'>
  <div class='imgSlider_content'>
<div class='ipsResponsive_hidePhone' data-ipsTruncate data-ipsTruncate-size='1 lines' data-ipsTruncate-type='remove'>
  <h3 class='imgSlider_title'><a title='{$record->_title}' href="{$record->url()}">{$record->_title}</a></h3>
</div>
<div class='ipsResponsive_hideDesktop' data-ipsTruncate data-ipsTruncate-size='4 lines' data-ipsTruncate-type='remove'>
  <h3 class='imgSlider_title'><a title='{$record->_title}' href="{$record->url()}">{$record->_title}</a></h3>
</div>
<div class='imgSlider_desc ipsType_reset ipsType_medium' data-ipsTruncate data-ipsTruncate-size='1 lines' data-ipsTruncate-type='remove'>{$record->truncated()|raw}</div>
<a class='ipsResponsive_hidePhone ipsButton imgSlider_button ipsPos_right' title='{$record->_title}' href="{$record->url()}">Read More</a>
    
<div class='dataItem'>
  <div class='ipsGrid'>
{{if $record->record_comments}}<div class='ipsGrid_span4'><i class="fa fa-comment"></i>{$record->record_comments}</div>{{endif}}
{{if $record->record_reviews}}<div class='ipsGrid_span4'><i class="fa fa-star"></i>{$record->record_reviews}</div>{{endif}}
{{if $record->record_views}}<div class='ipsGrid_span4'><i class="fa fa-eye"></i>{$record->record_views}</div>{{endif}}
  </div>
</div>     
<div class='imgSlider_who ipsClearfix'>
{{if $record->mapped('num_comments')}}
{template="userPhoto" group="global" app="core" params="$record->lastCommenter(), 'small'"}
<p>{$record->lastCommenter()->link()|raw}</p>
{expression="\IPS\Member\Group::load( $record->author()->member_group_id )->formattedName" raw="true"} 
{{else}}
{template="userPhoto" group="global" app="core" params="$record->author(), 'small'"}
<p>{$record->author()->link()|raw}</p>
{expression="\IPS\Member\Group::load( $record->author()->member_group_id )->formattedName" raw="true"}
{{endif}}
</div>     
    
</div>

</div>
{{endforeach}}   
</div>  
  
</div> 
</div> 
{{else}}  
{{foreach explode(',', theme.cc_theme_slider_place) as $val}}
{{if $val == 'forums' && request.module == 'forums' || $val == 'store' && request.module == 'store' || $val == 'pages' && request.module == 'pages' || $val == 'downloads' && request.module == 'downloads' || $val == 'leaderboard' && request.module == 'discover' && request.controller == 'popular' || $val == 'gallery' && request.module == 'gallery' || $val == 'blogs' && request.module == 'blogs' || $val == 'calendar' && request.module == 'calendar' || $val == 'activity' && request.module == 'discover' && request.controller == 'streams' || $val == 'staffdirectory' && request.module == 'staffdirectory' && request.controller == 'directory' || $val == 'search' && request.module == 'search' || $val == 'support' && request.module == 'support' || $val == 'members' && request.module == 'members' || $val == 'online' && request.module == 'online'}}  
  


<div class='cCpage_intro ipsClearfix'>
<div class='cCpage_intro_slider_db'>

<div class="theme_intro_slider theme_intro_slider_db">
{{foreach $records as $record}}
<div class='imgSlider' style='background-image: url({file="$record->_record_image_thumb" extension="cms_Records"});'>
  <div class='imgSlider_content'>
<div class='ipsResponsive_hidePhone' data-ipsTruncate data-ipsTruncate-size='1 lines' data-ipsTruncate-type='remove'>
  <h3 class='imgSlider_title'><a title='{$record->_title}' href="{$record->url()}">{$record->_title}</a></h3>
</div>
<div class='ipsResponsive_hideDesktop' data-ipsTruncate data-ipsTruncate-size='4 lines' data-ipsTruncate-type='remove'>
  <h3 class='imgSlider_title'><a title='{$record->_title}' href="{$record->url()}">{$record->_title}</a></h3>
</div>
<div class='imgSlider_desc ipsType_reset ipsType_medium' data-ipsTruncate data-ipsTruncate-size='1 lines' data-ipsTruncate-type='remove'>{$record->truncated()|raw}</div>
<a class='ipsResponsive_hidePhone ipsButton imgSlider_button ipsPos_right' title='{$record->_title}' href="{$record->url()}">Read More</a>
      
<div class='dataItem'>
  <div class='ipsGrid'>
{{if $record->record_comments}}<div class='ipsGrid_span4'><i class="fa fa-comment"></i>{$record->record_comments}</div>{{endif}}
{{if $record->record_reviews}}<div class='ipsGrid_span4'><i class="fa fa-star"></i>{$record->record_reviews}</div>{{endif}}
{{if $record->record_views}}<div class='ipsGrid_span4'><i class="fa fa-eye"></i>{$record->record_views}</div>{{endif}}
  </div>
</div>     
<div class='imgSlider_who ipsClearfix'>
{{if $record->mapped('num_comments')}}
{template="userPhoto" group="global" app="core" params="$record->lastCommenter(), 'small'"}
<p>{$record->lastCommenter()->link()|raw}</p>
{expression="\IPS\Member\Group::load( $record->author()->member_group_id )->formattedName" raw="true"} 
{{else}}
{template="userPhoto" group="global" app="core" params="$record->author(), 'small'"}
<p>{$record->author()->link()|raw}</p>
{expression="\IPS\Member\Group::load( $record->author()->member_group_id )->formattedName" raw="true"}
{{endif}}
</div>  
    
</div>

</div>
{{endforeach}}   
</div>  
  
</div> 
</div> 

{{endif}}
{{endforeach}}
{{endif}} 
{{endif}} 
{{endif}}

  <script> 
  $(document).ready(function(){
  $('.theme_intro_slider_db').bxSlider({
    auto: true,
    autoStart: true,             
{{if theme.ch_theme_slider_mode}}
	{{foreach explode(',', theme.ch_theme_slider_mode) as $val}}
		{{if $val == 'cctheme_slider_fade'}}
			mode: 'fade',
		{{endif}}
		{{if $val == 'cctheme_slider_horizontal'}}
			mode: 'horizontal',
		{{endif}}
   {{if $val == 'cctheme_slider_vertical'}}
			mode: 'vertical',
		{{endif}}
	{{endforeach}}
                    
{{else}}                    
mode: 'fade',                    
{{endif}}         
                    
{{if theme.ch_theme_slider_pager}}pager: true,{{else}}pager: false,{{endif}}    
{{if theme.ch_theme_slider_random}}randomStart: true,{{else}}randomStart: false,{{endif}} 
  controls: false,
{{if theme.ch_theme_slider_speed}}speed: {theme="ch_theme_slider_speed"},{{endif}}
{{if theme.ch_theme_slider_pause}}pause: {theme="ch_theme_slider_pause"},{{endif}}
  useCSS: false,
  tickerHover: true,     
  autoHover: true,
  preloadImages:'all',
  infiniteLoop: true
  });
});
  </script>

Same for Top posts block

{{if theme.ch_theme_slider_on}}
{{if theme.cc_theme_slider_permissions =='*' || \IPS\Member::loggedIn()->inGroup( explode( ',', theme.cc_theme_slider_permissions ) )}}
{{if theme.cc_theme_slider_place == '*'}}
<div class='site_welcome header_latest_posts_wrap' id='particle-canvas'>
<div class='sw_background'></div>  
<div class='sw_content'>
{{if \IPS\Member::loggedIn()->member_id }}
<h3>{theme="cc_theme_slider_normal_member_text"}</h3>
<p>{theme="cc_theme_slider_normal_member_desc"}</p>
<div class='discnews'>

<a class='discover' href='{{if theme.cc_theme_slider_normal_member_discurl}}{theme="cc_theme_slider_normal_member_discurl"}{{else}}{setting="base_url"}discover/{{endif}}'>{theme="cc_theme_slider_normal_member_text"}</a>
<a class='whatsnew' href='{{if theme.cc_theme_slider_normal_member_whatsnurl}}{theme="cc_theme_slider_normal_member_whatsnurl"}{{else}}{setting="base_url"}discover/unread/{{endif}}'>{theme="cc_theme_slider_normal_member_whatsntext"}</a>
</div>
{{else}}
<h3>{theme="cc_theme_slider_normal_guest_text"}</h3>
<p>{theme="cc_theme_slider_normal_guest_desc"}</p>
<div class='reglog'>
<a class='login' href='{{if theme.cc_theme_slider_normal_guest_loginurl}}{theme="cc_theme_slider_normal_guest_loginurl"}{{else}}{url="app=core&module=system&controller=login" seoTemplate="login" protocol="\IPS\Settings::i()->logins_over_https"}{{endif}}'>{theme="cc_theme_slider_normal_guest_logintext"}</a>
<a class='register' href='{{if theme.cc_theme_slider_normal_guest_regurl}}{theme="cc_theme_slider_normal_guest_regurl"}{{else}}{url="app=core&module=system&controller=register" seoTemplate="register"}{{endif}}'>{theme="cc_theme_slider_normal_guest_regtext"}</a>
</div>  
{{endif}}
  
</div>
  
<div class='header_latest_posts ipsResponsive_hidePhone ipsResponsive_hideTablet'>
{{foreach $comments as $comment}}
<div class='headerPost' style='display:none;'> 
<div class='headerPost_photo'>
<div class='photoSignal'></div> 
{template="userPhoto" group="global" app="core" params="$comment->author(), 'tiny'"}
</div>
<div class='headerPost_comment'>
<span class='text' data-ipsTruncate data-ipsTruncate-size='1 lines' data-ipsTruncate-type='remove'>
{{if \IPS\Member::loggedIn()->member_id }} 
<a href="{$comment->url()}" data-ipstooltip='' title='{$comment->item()->title}'>
{$comment->truncated( true )|raw}
</a> 
{{else}}
{$comment->truncated( true )|raw}
{{endif}}
</span>
</div>
</div>
{{endforeach}}
</div>
</div>
{{else}}

{{foreach explode(',', theme.cc_theme_slider_place) as $val}}
{{if $val == 'forums' && request.module == 'forums' || $val == 'store' && request.module == 'store' || $val == 'pages' && request.module == 'pages' || $val == 'downloads' && request.module == 'downloads' || $val == 'leaderboard' && request.module == 'discover' && request.controller == 'popular' || $val == 'gallery' && request.module == 'gallery' || $val == 'blogs' && request.module == 'blogs' || $val == 'calendar' && request.module == 'calendar' || $val == 'activity' && request.module == 'discover' && request.controller == 'streams' || $val == 'staffdirectory' && request.module == 'staffdirectory' && request.controller == 'directory' || $val == 'search' && request.module == 'search' || $val == 'support' && request.module == 'support' || $val == 'members' && request.module == 'members' || $val == 'online' && request.module == 'online'}}
<div class='site_welcome header_latest_posts_wrap' id='particle-canvas'>
<div class='sw_background'></div>  
<div class='sw_content'>
{{if \IPS\Member::loggedIn()->member_id }}
<h3>{theme="cc_theme_slider_normal_member_text"}</h3>
<p>{theme="cc_theme_slider_normal_member_desc"}</p>
<div class='discnews'>
<a class='discover' href='{{if theme.cc_theme_slider_normal_member_discurl}}{theme="cc_theme_slider_normal_member_discurl"}{{else}}{setting="base_url"}discover/{{endif}}'>{theme="cc_theme_slider_normal_member_disctext"}</a>
<a class='whatsnew' href='{{if theme.cc_theme_slider_normal_member_whatsnurl}}{theme="cc_theme_slider_normal_member_whatsnurl"}{{else}}{setting="base_url"}discover/unread/{{endif}}'>{theme="cc_theme_slider_normal_member_whatsntext"}</a>
</div>
{{else}}
<h3>{theme="cc_theme_slider_normal_guest_text"}</h3>
<p>{theme="cc_theme_slider_normal_guest_desc"}</p>
<div class='reglog'>
<a class='login' href='{{if theme.cc_theme_slider_normal_guest_loginurl}}{theme="cc_theme_slider_normal_guest_loginurl"}{{else}}{url="app=core&module=system&controller=login" seoTemplate="login" protocol="\IPS\Settings::i()->logins_over_https"}{{endif}}'>{theme="cc_theme_slider_normal_guest_logintext"}</a>
<a class='register' href='{{if theme.cc_theme_slider_normal_guest_regurl}}{theme="cc_theme_slider_normal_guest_regurl"}{{else}}{url="app=core&module=system&controller=register" seoTemplate="register"}{{endif}}'>{theme="cc_theme_slider_normal_guest_regtext"}</a>
</div>  
{{endif}}
  
</div>
  
<div class='header_latest_posts ipsResponsive_hidePhone ipsResponsive_hideTablet'>
{{foreach $comments as $comment}}
<div class='headerPost' style='display:none;'> 
<div class='headerPost_photo'>
<div class='photoSignal'></div> 
{template="userPhoto" group="global" app="core" params="$comment->author(), 'tiny'"}
</div>
<div class='headerPost_comment'>
<span class='text' data-ipsTruncate data-ipsTruncate-size='1 lines' data-ipsTruncate-type='remove'>
{{if \IPS\Member::loggedIn()->member_id }} 
<a href="{$comment->url()}" data-ipstooltip='' title='{$comment->item()->title}'>
{$comment->truncated( true )|raw}
</a> 
{{else}}
{$comment->truncated( true )|raw}
{{endif}}
</span>
</div>
</div>
{{endforeach}}
</div>
</div>
{{endif}}
{{endforeach}}
{{endif}} 
{{endif}} 
{{endif}} 

<script>
$(document).ready(function(){
	var time = 0;
	$('.headerPost').each(function() {
	    $(this).delay(time).fadeIn(2000);
	    time += 3500;
	});
});  
</script>
<script type="text/javascript" src="{resource="chocolate/particle-network.min.js" app="core" location="global"}">
            </script>
            <script type="text/javascript">
                var canvasDiv = document.getElementById('particle-canvas');
                var options = {
                    particleColor: '{theme="cc_theme_particles_color"}',
                    background: '#18181a',
                    interactive: false,
                    speed: 'fast',
                    density: 'medium'
                };
            </script>
<script>
  var particleCanvas = new ParticleNetwork(canvasDiv, options);
</script>

if you having any more issues 

chocolate-support-topic

when I load your site, I was like a vampire, slept for thousands of years and just now is my first glimpse of light haha.

Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
×
×
  • Create New...