Navbar width?

For support and discussion related to templates, themes, and imagesets in phpBB 3.2.
User avatar
yusufdj
Registered User
Posts: 109
Joined: Sun Feb 18, 2018 5:35 pm

Navbar width?

Post by yusufdj »

Hi, how can I expand the navbar section that I have specified in the image, which I have shown in the red arrows?

Image
https://camo.phpbb.com/3f77efb92681abdbc512fc324f4efbfabcbbf96a/687474703a2f2f6f6936372e74696e797069632e636f6d2f68726b6271722e6a7067
Last edited by yusufdj on Wed Mar 21, 2018 7:50 pm, edited 1 time in total.
User avatar
PlanetStyles.net
Former Team Member
Posts: 4809
Joined: Wed Nov 04, 2009 11:16 pm
Location: Way up in the sky close to the stars
Name: Christian
Contact:

Re: Navbar width?

Post by PlanetStyles.net »

Hello :)

Would you be able to share a link to your forum?

Thanks!
User avatar
yusufdj
Registered User
Posts: 109
Joined: Sun Feb 18, 2018 5:35 pm

Re: Navbar width?

Post by yusufdj »

Christian 2.0 wrote: Wed Mar 21, 2018 5:42 pm Hello :)

Would you be able to share a link to your forum?

Thanks!
Hi, I'm working on localhost.
User avatar
Sniper_E
Registered User
Posts: 1126
Joined: Wed May 09, 2007 12:18 am
Location: Shreveport, Louisiana
Name: Ed Humphrey
Contact:

Re: Navbar width?

Post by Sniper_E »

In prosilver the header and header navbar are inside of the .wrap wrapper and the .wrap has a max-width.
I have a style with full width header and header navbar, along with full width footer navbar and footer.
And the forum and it's contents are in the .wrap so that section is smaller in width.
But to get that I had to take the header and header navbar codes out of the .wrap codes. Same for the footer codes.

I'll share my overall_header.html template codes to show you how I did it.

Code: Select all

<body id="phpbb" class="nojs notouch section-{SCRIPT_NAME} {S_CONTENT_DIRECTION} {BODY_CLASS}">

	<!-- EVENT overall_header_body_before -->

	<a id="top" class="top-anchor" accesskey="t"></a>
	<div id="page-header">
		<div class="headerbar" role="banner">
		<!-- EVENT overall_header_headerbar_before -->
			<div class="inner">

				<div id="site-description" class="site-description">
					<a id="logo" class="logo" href="<!-- IF U_SITE_HOME -->{U_SITE_HOME}<!-- ELSE -->{U_INDEX}<!-- ENDIF -->" title="<!-- IF U_SITE_HOME -->{L_SITE_HOME}<!-- ELSE -->{L_INDEX}<!-- ENDIF -->"><span class="site_logo"></span></a>
					<div class="site-name"><h1>{SITENAME}</h1>
					<p>{SITE_DESCRIPTION}</p></div>
					<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
				</div>
	
				<!-- EVENT overall_header_searchbox_before -->
				<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
				<div id="search-box" class="search-box search-header" role="search">
					<form action="{U_SEARCH}" method="get" id="search">
					<fieldset>
						<input name="keywords" id="keywords" type="search" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search tiny" size="20" value="{SEARCH_WORDS}" placeholder="{L_SEARCH_MINI}" />
						<button class="button button-search" type="submit" title="{L_SEARCH}">
							<i class="icon fa-search fa-fw" aria-hidden="true"></i><span class="sr-only">{L_SEARCH}</span>
						</button>
						<a href="{U_SEARCH}" class="button button-search-end" title="{L_SEARCH_ADV}">
							<i class="icon fa-cog fa-fw" aria-hidden="true"></i><span class="sr-only">{L_SEARCH_ADV}</span>
						</a>
						{S_SEARCH_HIDDEN_FIELDS}
					</fieldset>
					</form>
				</div>
				<!-- ENDIF -->
				<!-- EVENT overall_header_searchbox_after -->

			</div>
		<!-- EVENT overall_header_headerbar_after -->
		</div>
		<!-- EVENT overall_header_navbar_before -->
		<!-- INCLUDE navbar_header.html -->

		<!-- IF SCRIPT_NAME == "index" -->
			<p class="{S_CONTENT_FLOW_END} responsive-center time<!-- IF S_USER_LOGGED_IN --> rightside<!-- ENDIF -->"><strong class="last-visit"><!-- IF S_USER_LOGGED_IN -->{LAST_VISIT_DATE}<!-- ELSE -->{CURRENT_TIME}<!-- ENDIF --></strong></p>
			<!-- IF S_USER_LOGGED_IN --><p class="responsive-center time"><strong class="current-time">{CURRENT_TIME}</strong></p><!-- ENDIF -->
		<!-- ENDIF -->
	</div>

	<!-- EVENT overall_header_page_body_before -->

	<a id="start_here" class="anchor"></a>
	<div id="page-body" class="page-body" role="main">
		<div class="wrapper">
			<div id="wrap" class="wrap">
				<!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN and (U_MCP or U_ACP) -->
				<div id="information" class="rules">
					<div class="inner">
						<strong>{L_INFORMATION}{L_COLON}</strong> {L_BOARD_DISABLED}
					</div>
				</div>
				<!-- ENDIF -->
		
				<!-- EVENT overall_header_content_before -->
Notice how the .wrap codes are after the header and header navbar codes at the bottom.
You can see the .page-body does not start until after the header and header navbar.
Then I was able to adjust the css to position both full width without effecting the forum.

Christian/We would have to see your source codes and css to see how your style is written.
Image . -.. / .... ..- -- .--. .... .-. . -.--
No is NEVER an Option and NEVER is the only Option when it comes to Giving Up!

:!: Sniper_E Styles | phpbbmodders :!:
User avatar
yusufdj
Registered User
Posts: 109
Joined: Sun Feb 18, 2018 5:35 pm

Re: Navbar width?

Post by yusufdj »

Sniper_E wrote: Wed Mar 21, 2018 6:27 pm In prosilver the header and header navbar are inside of the .wrap wrapper and the .wrap has a max-width.
I have a style with full width header and header navbar, along with full width footer navbar and footer.
And the forum and it's contents are in the .wrap so that section is smaller in width.
But to get that I had to take the header and header navbar codes out of the .wrap codes. Same for the footer codes.

I'll share my overall_header.html template codes to show you how I did it.

Code: Select all

<body id="phpbb" class="nojs notouch section-{SCRIPT_NAME} {S_CONTENT_DIRECTION} {BODY_CLASS}">

	<!-- EVENT overall_header_body_before -->

	<a id="top" class="top-anchor" accesskey="t"></a>
	<div id="page-header">
		<div class="headerbar" role="banner">
		<!-- EVENT overall_header_headerbar_before -->
			<div class="inner">

				<div id="site-description" class="site-description">
					<a id="logo" class="logo" href="<!-- IF U_SITE_HOME -->{U_SITE_HOME}<!-- ELSE -->{U_INDEX}<!-- ENDIF -->" title="<!-- IF U_SITE_HOME -->{L_SITE_HOME}<!-- ELSE -->{L_INDEX}<!-- ENDIF -->"><span class="site_logo"></span></a>
					<div class="site-name"><h1>{SITENAME}</h1>
					<p>{SITE_DESCRIPTION}</p></div>
					<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
				</div>
	
				<!-- EVENT overall_header_searchbox_before -->
				<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
				<div id="search-box" class="search-box search-header" role="search">
					<form action="{U_SEARCH}" method="get" id="search">
					<fieldset>
						<input name="keywords" id="keywords" type="search" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search tiny" size="20" value="{SEARCH_WORDS}" placeholder="{L_SEARCH_MINI}" />
						<button class="button button-search" type="submit" title="{L_SEARCH}">
							<i class="icon fa-search fa-fw" aria-hidden="true"></i><span class="sr-only">{L_SEARCH}</span>
						</button>
						<a href="{U_SEARCH}" class="button button-search-end" title="{L_SEARCH_ADV}">
							<i class="icon fa-cog fa-fw" aria-hidden="true"></i><span class="sr-only">{L_SEARCH_ADV}</span>
						</a>
						{S_SEARCH_HIDDEN_FIELDS}
					</fieldset>
					</form>
				</div>
				<!-- ENDIF -->
				<!-- EVENT overall_header_searchbox_after -->

			</div>
		<!-- EVENT overall_header_headerbar_after -->
		</div>
		<!-- EVENT overall_header_navbar_before -->
		<!-- INCLUDE navbar_header.html -->

		<!-- IF SCRIPT_NAME == "index" -->
			<p class="{S_CONTENT_FLOW_END} responsive-center time<!-- IF S_USER_LOGGED_IN --> rightside<!-- ENDIF -->"><strong class="last-visit"><!-- IF S_USER_LOGGED_IN -->{LAST_VISIT_DATE}<!-- ELSE -->{CURRENT_TIME}<!-- ENDIF --></strong></p>
			<!-- IF S_USER_LOGGED_IN --><p class="responsive-center time"><strong class="current-time">{CURRENT_TIME}</strong></p><!-- ENDIF -->
		<!-- ENDIF -->
	</div>

	<!-- EVENT overall_header_page_body_before -->

	<a id="start_here" class="anchor"></a>
	<div id="page-body" class="page-body" role="main">
		<div class="wrapper">
			<div id="wrap" class="wrap">
				<!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN and (U_MCP or U_ACP) -->
				<div id="information" class="rules">
					<div class="inner">
						<strong>{L_INFORMATION}{L_COLON}</strong> {L_BOARD_DISABLED}
					</div>
				</div>
				<!-- ENDIF -->
		
				<!-- EVENT overall_header_content_before -->
Notice how the .wrap codes are after the header and header navbar codes at the bottom.
You can see the .page-body does not start until after the header and header navbar.
Then I was able to adjust the css to position both full width without effecting the forum.

Christian/We would have to see your source codes and css to see how your style is written.
Thank you very much
User avatar
Sniper_E
Registered User
Posts: 1126
Joined: Wed May 09, 2007 12:18 am
Location: Shreveport, Louisiana
Name: Ed Humphrey
Contact:

Re: Navbar width?

Post by Sniper_E »

Try taking this section:

Code: Select all

<!-- EVENT overall_header_body_before -->

<div id="wrap" class="wrap">
	<div id="page-header">
		<!-- EVENT overall_header_navbar_before -->
		<!-- INCLUDE navbar_header.html -->
	</div>
And move the navbar codes out of the .wrap section like this:

Code: Select all

<!-- EVENT overall_header_body_before -->
	<div id="page-header">
		<!-- EVENT overall_header_navbar_before -->
		<!-- INCLUDE navbar_header.html -->
	</div>
<div id="wrap" class="wrap">
Then you should be able to adjust your css for your .spark or .spark-top classes to get it to the sides.
Keep a backup of your template before you start just in case...
Image . -.. / .... ..- -- .--. .... .-. . -.--
No is NEVER an Option and NEVER is the only Option when it comes to Giving Up!

:!: Sniper_E Styles | phpbbmodders :!:
User avatar
yusufdj
Registered User
Posts: 109
Joined: Sun Feb 18, 2018 5:35 pm

Re: Navbar width?

Post by yusufdj »

hi, I want help here to not open an additional topic. How can I turn off the gap that I showed in the picture?

Image
https://camo.phpbb.com/b57686ab2fda1bb4a6400cd8abe31a049657639e/687474703a2f2f6f6936372e74696e797069632e636f6d2f326869396b37362e6a7067
User avatar
Sniper_E
Registered User
Posts: 1126
Joined: Wed May 09, 2007 12:18 am
Location: Shreveport, Louisiana
Name: Ed Humphrey
Contact:

Re: Navbar width?

Post by Sniper_E »

By typing in a whole lot of text to fill that gap up. lol

The post section is as tall as the profile section to the left of the post.
If you had a huge amount of text in your post the profile section would have that big space.

You can not get rid of that space, it's part of the block.
Image . -.. / .... ..- -- .--. .... .-. . -.--
No is NEVER an Option and NEVER is the only Option when it comes to Giving Up!

:!: Sniper_E Styles | phpbbmodders :!:
User avatar
yusufdj
Registered User
Posts: 109
Joined: Sun Feb 18, 2018 5:35 pm

Re: Navbar width?

Post by yusufdj »

Sniper_E wrote: Wed Mar 21, 2018 6:50 pm By typing in a whole lot of text to fill that gap up. lol

The post section is as tall as the profile section to the left of the post.
If you had a huge amount of text in your post the profile section would have that big space.

You can not get rid of that space, it's part of the block.
it is ridiculous but I think it should be a solution
User avatar
yusufdj
Registered User
Posts: 109
Joined: Sun Feb 18, 2018 5:35 pm

Re: Navbar width?

Post by yusufdj »

when the writing is too long it is not changing anything
Is there anything to do with the plugin I installed? I installed a plugin to get the profile to the left.


Image
https://camo.phpbb.com/02d0bea4c1c75251a05b47a3d515c14df589f747/687474703a2f2f6f6936382e74696e797069632e636f6d2f31303773386d302e6a7067
User avatar
Lumpy Burgertushie
Registered User
Posts: 69223
Joined: Mon May 02, 2005 3:11 am
Contact:

Re: Navbar width?

Post by Lumpy Burgertushie »

I don't think he is talking about the vertical space. I think he is talking about the space between the profile box and the actual text of the post.

yusufdj: we need to know what style that is, what extensions you have installed and/or any other changes you have made to the html/css files


robert
Premium phpBB 3.3 Styles by PlanetStyles.net

I am pleased to announce that I have completed the first item on my bucket list. I have the bucket.
User avatar
Sniper_E
Registered User
Posts: 1126
Joined: Wed May 09, 2007 12:18 am
Location: Shreveport, Louisiana
Name: Ed Humphrey
Contact:

Re: Navbar width?

Post by Sniper_E »

The only solution is if you placed the profile section above the posted section. Then no gap would be there.

But that is another topic. Isn't there a ext out somewhere that will do that for you?

Edit: Ok, that gap. I bet it is the ext you installed for profile to the left. CSS maybe.
Image . -.. / .... ..- -- .--. .... .-. . -.--
No is NEVER an Option and NEVER is the only Option when it comes to Giving Up!

:!: Sniper_E Styles | phpbbmodders :!:
User avatar
yusufdj
Registered User
Posts: 109
Joined: Sun Feb 18, 2018 5:35 pm

Re: Navbar width?

Post by yusufdj »

When I make the attachment passive, the image looks like this. how do I get the profile right without the plugin?
even in this way the profile section is very wide

Image
https://camo.phpbb.com/f16a19b90550bd1ed0525590668f4c7b6fc41da2/687474703a2f2f6f6936342e74696e797069632e636f6d2f3636633779662e6a7067
User avatar
Lumpy Burgertushie
Registered User
Posts: 69223
Joined: Mon May 02, 2005 3:11 am
Contact:

Re: Navbar width?

Post by Lumpy Burgertushie »

no reason to try. use the extension and edit the extension file.

ask the extension author how to do it.
the problem is most likely that the extension is designed for prosilver and it doesn't look like you are using prosilver.
hard to tell with no info from you about what style it is.


robert
Premium phpBB 3.3 Styles by PlanetStyles.net

I am pleased to announce that I have completed the first item on my bucket list. I have the bucket.
User avatar
yusufdj
Registered User
Posts: 109
Joined: Sun Feb 18, 2018 5:35 pm

Re: Navbar width?

Post by yusufdj »

Lumpy Burgertushie wrote: Wed Mar 21, 2018 7:28 pm no reason to try. use the extension and edit the extension file.

ask the extension author how to do it.
the problem is most likely that the extension is designed for prosilver and it doesn't look like you are using prosilver.
hard to tell with no info from you about what style it is.


robert
I use it as a theme;
https://www.phpbb.com/customise/db/styl ... r/demo/3.2
Post Reply

Return to “[3.2.x] Styles Support & Discussion”