VISIT AND LIKE OUR PAGE ON FACEBOOK
TAKE A LOOK AT OUR TWEETS ON TWITTER
SUBSCRIBE TO THE JOOMFREAK RSS FEED
VISIT OUR CHANNEL ON YOUTUBE

Account Details

Change your name, email, password or permanently delete your account. Change settings

We offer several ways you can get support from our experts: Support ForumKnowledgebaseNewsletter

Your Forum Posts

No posts to display.

Welcome, Guest
Username Password: Remember me

Menu color in pages without slideshow
(1 viewing) (1) Guest
  • Page:
  • 1

TOPIC: Menu color in pages without slideshow

Menu color in pages without slideshow 27 May 2016 21:41 #8898

Hi,

I'm trying to obtain a visible menu in those pages different from the home that don't have a slideshow. In these pages the menu is transparent, with white text color and if you have a background-color of the whole page set to light-grey, these menu voices are invisibles.

I'm looking on your jfsalina demo, and I saw that you used a class called "section-inner" to obtain a dark background with the page title (for example in a page called "Masonry Portfolio").
How I can obtain a similar effect? I have tryed to put a module in "welcome" position and add "section-inner" class, but this method don't work. I have tryed also to with a custom module, setting the width to 100%, heigth 200px and a background color, but I don't like the results.

What can I do?

Thank you

  • Posts:66
  • me
  • Senior Boarder
  • OFFLINE
  • Karma: 0

Re: Menu color in pages without slideshow 29 May 2016 14:15 #8901

I solved using a module in "slideshow" position, I have created a Joomla "customized" module, and I have added with "Sourcerer" (Sourcerer is a plugin for adding html, css, php and js code snippets) this code writed by me:

 
 
{source} <!-- the sourcerer snippet starting tag -->
 
style <!-- You need to put here the START style tag, this forum can t permit me to add this kind of tag with major and minor signs for style element -->
 
.background_for_menu{
width: 100%;
height: 400px;
float: left;
position: relative;
top: 0;
background-color: black;
}
 
.bg_image_for_menu {
position: absolute;
background-image: url("/images/back_menu.jpg"); <!-- your image source -->
background-repeat: no-repeat;
background-size: cover;
background-position: center;
height: 400px;
opacity: 0.4;
width: 100%;
}
 
.text_for_menu_area {
width: 100%;
position: absolute;
margin-top: 160px;
font-size: 46px;
font-weight: 300;
letter-spacing: 3px;
color:white;
}
 
style <!-- put here the END style tag here, this forum can t permit me to add this kind of tag with major and minor signs for style element -->
 
 
<div class="background_for_menu">
 
<div class="bg_image_for_menu"> </div>
<div class="text_for_menu_area"> Contact Us </div>
 
</div>
 
{/source}
 
 


The result it's similar at what you can see here: www.joomfreak.com/demo/jf_salina/portfol...rtfolio-masonry.html with a dark top bar, title, and background image with opacity.

I hope that this solution can be useful for other people.

Last Edit: 04 Jun 2016 14:33 by me.

  • Posts:66
  • me
  • Senior Boarder
  • OFFLINE
  • Karma: 0

Re: Menu color in pages without slideshow 30 May 2016 02:58 #8903

Thank you for your sharing!

joomfreak
The following user(s) said Thank You: me

  • Posts:2763
  • isupport
  • Moderator
  • OFFLINE
  • Karma: 0

Re: Menu color in pages without slideshow 04 Jun 2016 14:27 #8936

isupport wrote:
Thank you for your sharing!

joomfreak


Thank you for your work guys

  • Posts:66
  • me
  • Senior Boarder
  • OFFLINE
  • Karma: 0
  • Page:
  • 1
Time to create page: 0.93 seconds
Thursday 20 June 2019

joomfreak is not affiliated with or endorsed by the Joomla Project or Open Source Matters.
The Joomla logo is used under a limited license granted by Open Source Matters the trademark holder in the United States and other countries.