navigation changes

Need some custom code changes to the phpBB core simple enough that you feel doesn't require an extension? Then post your request here so that community members can provide some assistance.

NOTE: NO OFFICIAL SUPPORT IS PROVIDED IN THIS SUB-FORUM
Forum rules
READ: phpBB.com Board-Wide Rules and Regulations

NOTE: NO OFFICIAL SUPPORT IS PROVIDED IN THIS SUB-FORUM
Charisma44
Registered User
Posts: 390
Joined: Thu Nov 12, 2015 7:45 pm

Re: navigation changes

Post by Charisma44 »

Adding drop down to existing menu is not as simple as I thought lol.
Charisma44
Registered User
Posts: 390
Joined: Thu Nov 12, 2015 7:45 pm

Re: navigation changes

Post by Charisma44 »

I have been talking to a couple local web developers and there telling me. I can not add drop downs in a custom menu. Whats people senses?
User avatar
GanstaZ
Registered User
Posts: 1187
Joined: Wed Oct 11, 2017 10:29 pm
Location: GZOverse

Re: navigation changes

Post by GanstaZ »

Wasn't your previous navigation a custom one?) Give me some time i'll edit this post with the code to try.

Code: Select all

<style>
.nav {
    position: relative;
    margin: 0 auto;
    font-family: 'Oswald', sans-serif;
    font-size: 1.4em;
    text-align: left;
}	

.nav ul {
    list-style: none;
    background-color: #21cf20;
    padding: 5px;
}

.nav li {
    margin: 0 5px;
}

.nav a {
    text-decoration: none;
    color: #000;
}

.nav a:hover {
    color: #ffffff;
}

@media screen and (min-width: 650px) {
    .nav li {	
        width: auto;
        display: inline-block;
    }

    /* Sub Menus.. Index 1 or 2 */
    .nav li ul {
        position: absolute;
        display: none;
        z-index: 2;
    }

    .nav li:hover ul {
        display: block;
    }

    .nav li ul li {
        display: block;
    }
}

</style>

<div class="nav">
<ul>
<li class="home"><a href="../../../../index.html">Home</a></li>
<li class="tutorials"><a href="#">Links</a>
<ul>
<li><a href="#">Buy And Sell</a></li>
<li><a href="#">Canadian Amputee Golf Association (CAGA)</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">Groups</a></li>
<li><a href="#">Golf Buddy</a></li>
<li><a href="#">Golf Course Owners and Operators</a></li> 
</ul>
</li>
<li class="about"><a class="active" href="../../../../Provinces.html">Provinces</a></li>
<li class="contact"><a href="../../../../Courses.html">Courses</a></li>
<li class="contact"><a href="../../../../Snowbirds.html">Snowbirds</a></li> 
<li class="contact"><a href="http://www.empoweredgolfersmanitoba.ca/phpBB3/">Discussion Board</a></li> 
<li class="contact"><a href="../../../../Chatroom.html">Live Chat</a></li>
<li class="contact"><a href="../../../../Contact.html">Contact Us</a></li> 
</ul>
</div>
Last edited by GanstaZ on Fri Mar 23, 2018 11:44 pm, edited 2 times in total.
Usus est magister optimus! phpBB pre-Triton & latest php environment.
When answer lies in the question, question becomes redundant!
Charisma44
Registered User
Posts: 390
Joined: Thu Nov 12, 2015 7:45 pm

Re: navigation changes

Post by Charisma44 »

Yes it was but no drop down under links.
Charisma44
Registered User
Posts: 390
Joined: Thu Nov 12, 2015 7:45 pm

Re: navigation changes

Post by Charisma44 »

I'm not sure if this is helpful to you. it's the latest.

Code: Select all

<!DOCTYPE html>
<html dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1" />
{META}
<title><!-- IF UNREAD_NOTIFICATIONS_COUNT -->({UNREAD_NOTIFICATIONS_COUNT}) <!-- ENDIF --><!-- IF not S_VIEWTOPIC and not S_VIEWFORUM -->{SITENAME} - <!-- ENDIF --><!-- IF S_IN_MCP -->{L_MCP} - <!-- ELSEIF S_IN_UCP -->{L_UCP} - <!-- ENDIF -->{PAGE_TITLE}<!-- IF S_VIEWTOPIC or S_VIEWFORUM --> - {SITENAME}<!-- ENDIF --></title>

<!-- IF S_ENABLE_FEEDS -->
<!-- IF S_ENABLE_FEEDS_OVERALL --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {SITENAME}" href="{U_FEED}"><!-- ENDIF -->
<!-- IF S_ENABLE_FEEDS_NEWS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_NEWS}" href="{U_FEED}?mode=news"><!-- ENDIF -->
<!-- IF S_ENABLE_FEEDS_FORUMS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_ALL_FORUMS}" href="{U_FEED}?mode=forums"><!-- ENDIF -->
<!-- IF S_ENABLE_FEEDS_TOPICS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_TOPICS_NEW}" href="{U_FEED}?mode=topics"><!-- ENDIF -->
<!-- IF S_ENABLE_FEEDS_TOPICS_ACTIVE --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_TOPICS_ACTIVE}" href="{U_FEED}?mode=topics_active"><!-- ENDIF -->
<!-- IF S_ENABLE_FEEDS_FORUM and S_FORUM_ID --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FORUM} - {FORUM_NAME}" href="{U_FEED}?f={S_FORUM_ID}"><!-- ENDIF -->
<!-- IF S_ENABLE_FEEDS_TOPIC and S_TOPIC_ID --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_TOPIC} - {TOPIC_TITLE}" href="{U_FEED}?f={S_FORUM_ID}&amp;t={S_TOPIC_ID}"><!-- ENDIF -->
<!-- EVENT overall_header_feeds -->
<!-- ENDIF -->

<!-- IF U_CANONICAL -->
<link rel="canonical" href="{U_CANONICAL}">
<!-- ENDIF -->

<!--
phpBB style name: prosilver
Based on style: prosilver (this is the default phpBB3 style)
Original author: Tom Beddard ( http://www.subBlue.com/ )
Modified by:
-->

<!-- IF S_ALLOW_CDN -->
<script>
WebFontConfig = {
google: {
families: ['Open+Sans:600:cyrillic-ext,latin,greek-ext,greek,vietnamese,latin-ext,cyrillic']
}
};

(function(d) {
var wf = d.createElement('script'), s = d.scripts[0];
wf.src = 'https://ajax.googleapis.com/ajax/libs/w ... webfont.js';
wf.async = true;
s.parentNode.insertBefore(wf, s);
})(document);
</script>
<!-- ENDIF -->
<link href="{T_STYLESHEET_LINK}" rel="stylesheet">
<link href="{T_STYLESHEET_LANG_LINK}" rel="stylesheet">
<link href="{T_THEME_PATH}/responsive.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet" media="all and (max-width: 700px)">

<!-- IF S_CONTENT_DIRECTION eq 'rtl' -->
<link href="{T_THEME_PATH}/bidi.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet">
<!-- ENDIF -->

<!-- IF S_PLUPLOAD -->
<link href="{T_THEME_PATH}/plupload.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet">
<!-- ENDIF -->

<!--[if lte IE 9]>
<link href="{T_THEME_PATH}/tweaks.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet">
<![endif]-->

<!-- EVENT overall_header_head_append -->

{$STYLESHEETS}

<!-- EVENT overall_header_stylesheets_after -->
<style>
/* Add a black background color to the top navigation */
.topnav {
    background-color: #21cf20;
    overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
    float: left;
    color: #000000;
    text-align: center;
    padding: 14px 10px;
    text-decoration: none;
    font-size: 19px;
}

/* Change the color of links on hover */
.topnav a:hover {
    background-color: #21cf20;
    color: white;
}

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

<!-- EVENT overall_header_body_before -->

<div id="wrap">
<a id="top" class="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">
<h1 style="font-size: 3em;">Empowered Golfers Manitoba</h1>


<div class="topnav">
  <a class="active" href="../../../../index.html">Home</a>
  <a href="#">Links</a>
   <a href="../../../../Provinces.html">Provinces</a>
   <a href="../../../../Courses.html">Courses</a>
   <a href="../../../../Snowbirds.html">Snowbirds</a>
   <a href="http://www.empoweredgolfersmanitoba.ca/phpBB3/">Discussion Board</a>
   <a href="../../../../Chatroom.html">Live Chat</a>
  <a href="../../../../Contact.html">Contact</a>
 
</div>

</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 icon-button search-icon" type="submit" title="{L_SEARCH}">{L_SEARCH}</button>
<a href="{U_SEARCH}" class="button icon-button search-adv-icon" title="{L_SEARCH_ADV}">{L_SEARCH_ADV}</a>
{S_SEARCH_HIDDEN_FIELDS}
</fieldset>
</form>
</div>
<!-- ENDIF -->
<!-- menu start -->
</div>

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

<!-- menu ends -->
<!-- EVENT overall_header_page_body_before -->

<a id="start_here" class="anchor"></a>
<div id="page-body" role="main">
<!-- 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 -->
User avatar
GanstaZ
Registered User
Posts: 1187
Joined: Wed Oct 11, 2017 10:29 pm
Location: GZOverse

Re: navigation changes

Post by GanstaZ »

Look above.. don't have much time to make it better, but it is a working example of your previous code.
Usus est magister optimus! phpBB pre-Triton & latest php environment.
When answer lies in the question, question becomes redundant!
Charisma44
Registered User
Posts: 390
Joined: Thu Nov 12, 2015 7:45 pm

Re: navigation changes

Post by Charisma44 »

It is working. I just can’t add drop down menu under links.
User avatar
GanstaZ
Registered User
Posts: 1187
Joined: Wed Oct 11, 2017 10:29 pm
Location: GZOverse

Re: navigation changes

Post by GanstaZ »

Take a look at my previous post above with code tag ;)
Usus est magister optimus! phpBB pre-Triton & latest php environment.
When answer lies in the question, question becomes redundant!
Charisma44
Registered User
Posts: 390
Joined: Thu Nov 12, 2015 7:45 pm

Re: navigation changes

Post by Charisma44 »

Post 112?
User avatar
GanstaZ
Registered User
Posts: 1187
Joined: Wed Oct 11, 2017 10:29 pm
Location: GZOverse

Re: navigation changes

Post by GanstaZ »

This post. The code to try is below in code tag:
GanstaZ wrote: Fri Mar 23, 2018 9:51 pm Wasn't your previous navigation a custom one?) Give me some time i'll edit this post with the code to try.

Code: Select all

<style>
.nav {
    position: relative;
    margin: 0 auto;
    font-family: 'Oswald', sans-serif;
    font-size: 1.4em;
    text-align: left;
}	

.nav ul {
    list-style: none;
    background-color: #21cf20;
    padding: 5px;
}

.nav li {
    margin: 0 5px;
}

.nav a {
    text-decoration: none;
    color: #000;
}

.nav a:hover {
    color: #ffffff;
}

@media screen and (min-width: 650px) {
    .nav li {	
        width: auto;
        display: inline-block;
    }

    /* Sub Menus.. Index 1 or 2 */
    .nav li ul {
        position: absolute;
        display: none;
        z-index: 2;
    }

    .nav li:hover ul {
        display: block;
    }

    .nav li ul li {
        display: block;
    }
}

</style>

<div class="nav">
<ul>
<li class="home"><a href="../../../../index.html">Home</a></li>
<li class="tutorials"><a href="#">Links</a>
<ul>
<li><a href="#">Buy And Sell</a></li>
<li><a href="#">Canadian Amputee Golf Association (CAGA)</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">Groups</a></li>
<li><a href="#">Golf Buddy</a></li>
<li><a href="#">Golf Course Owners and Operators</a></li> 
</ul>
</li>
<li class="about"><a class="active" href="../../../../Provinces.html">Provinces</a></li>
<li class="contact"><a href="../../../../Courses.html">Courses</a></li>
<li class="contact"><a href="../../../../Snowbirds.html">Snowbirds</a></li> 
<li class="contact"><a href="http://www.empoweredgolfersmanitoba.ca/phpBB3/">Discussion Board</a></li> 
<li class="contact"><a href="../../../../Chatroom.html">Live Chat</a></li>
<li class="contact"><a href="../../../../Contact.html">Contact Us</a></li> 
</ul>
</div>
Last edited by GanstaZ on Fri Mar 23, 2018 11:45 pm, edited 1 time in total.
Usus est magister optimus! phpBB pre-Triton & latest php environment.
When answer lies in the question, question becomes redundant!
Charisma44
Registered User
Posts: 390
Joined: Thu Nov 12, 2015 7:45 pm

Re: navigation changes

Post by Charisma44 »

Thank you. :)
User avatar
GanstaZ
Registered User
Posts: 1187
Joined: Wed Oct 11, 2017 10:29 pm
Location: GZOverse

Re: navigation changes

Post by GanstaZ »

I updated the code, you need to add z-index:

Code: Select all

    /* Sub Menus.. Index 1 or 2 */
    .nav li ul {
        position: absolute;
        display: none;
        z-index: 2;
    }
Usus est magister optimus! phpBB pre-Triton & latest php environment.
When answer lies in the question, question becomes redundant!
Charisma44
Registered User
Posts: 390
Joined: Thu Nov 12, 2015 7:45 pm

Re: navigation changes

Post by Charisma44 »

Thanks so much for your time.
User avatar
Mick
Support Team Member
Support Team Member
Posts: 26502
Joined: Fri Aug 29, 2008 9:49 am

Re: navigation changes

Post by Mick »

Is this sorted now?
  • "The more connected we get the more alone we become" - Kyle Broflovski©
  • "The good news is hell is just the product of a morbid human imagination.
    The bad news is, whatever humans can imagine, they can usually create.
    " - Harmony Cobel
Charisma44
Registered User
Posts: 390
Joined: Thu Nov 12, 2015 7:45 pm

Re: navigation changes

Post by Charisma44 »

Yes it is. Thanks to all.
Post Reply

Return to “phpBB Custom Coding”