so guys i have been trying to figure out to hide the subnav item into a drop down list how should i approach it? can it be done with css or i have to do some coding work to in order to get it function properly. what i am trying to do is when my mouse hovers over 'activity' 'profile' it drops down the sub nav items for the user
and any help how to hide entry title on a specific page i tried doing it like this
entry-title{
display:none;
}
and it hides it from the whole site and em just trying to shut it off from the buddypress pages..
any answers with examples will be highly appericiated
Buddypress adds a bbpress class to the body on buddypress related pages, you can use that to identify it as a bbpress page
.bbpress .entry-title{
display:none;
}
There are couple of ways you can achieve that.
Using javascript.
if (window.location.href.indexOf("settings") != -1) {
$(".entry-title").hide();
}
Copy the buddypress folder into your theme folder follow this link https://codex.buddypress.org/themes/theme-compatibility-1-7/a-quick-look-at-1-7-theme-compatibility/
and then you can add your own class into those pages and then you can
.customeclass .entry-title{
display:none;
}
or simply you can use Jeffrey Troost suggestion
Related
I have been working on this for quite a while, and cannot seem to find why my dropdown menu is not working. After searching many online forums and asking friends, I have no answer. I just want the dropdown to work. I cannot seem to make the .dropdown_trigger class make the .dropdown class hide, or reappear. Any help would be very much appreciated. Linked below are the pages.
Thanks,
Alex
Index Page CSS File
By inspecting the html page provided in the "Index Page" link, there is only one element with the "dropdown" class, and it's empty. It's not clear what your code is trying to show or hide.
<div class="dropdown"></div>
The "dropdown_trigger" class is located in a table header element:
<th>
PROJECTS
</th>
By inspection, there does not appear to be any javascript to trigger any behavior. It does not show up in Source in the Chrome Inspector. Normally, this would be done with JS to use .show() or .hide(), for example if you had jQuery (there are other ways). Or are you trying to create this without JS at all? Are you trying to create dropdown menus with only CSS?
If so, please check this tutorial out:
https://css-tricks.com/solved-with-css-dropdown-menus/
The key part is here:
ul li:hover > ul,
ul li ul:hover {
visibility: visible;
opacity: 1;
display: block;
}
By creating a CSS rule to change the visibility, the dropdown menu can be shown. However, there does not appear to be any HTML content to show in the current linked page you provided. That div is empty.
I have a problem with a personal project, http://mail.fixca.com.gt/. on Drupal 8 with the profile Brainstorm
The menu doesn't display the submenus created. I have already:
Set Show Expanded mode on the menu item.
Set the max menu level display on the block it self.
Tried to create a new menu and CSS it to get it display the submenu
.submenu{
display:none;
}
.companymenuli:hover > ul{
display:block;
}
but it never shows the submenu. I realise that it might be something I'm just not doing right, but I cann't find the solution.
The HTML on the Drupals Website shows like this
HTML from chrome developer
I think that it might be some kind of restriction on the theme itself.
I really appreciate your help. If you have give mi a hint on where I might be able to find the solution.
Thank you.
Overflow: hidden. is added in below css:
#block-brainstorm-theme-main-menu
Once you remove overflow property from here and also remove display: none. from
#block-brainstorm-theme-main-menu ul ul
Submenu will display. But you have to work on css and js for proper look and feel. Instead I suggest to use some jquery for this.Also you can use modules like Nice menu or Superfish menu for the same. Let me know if i can help you in this.
Hi I'm using SquareSpace V6, with the Momentum template.
in this template there's an option to have the style of your gallery "full-bleed" or simply centered, but this setting is global and it applies to all the galleries on the website.
I'm trying to create some CSS code that will override the default and allow me to have a "full-bleed" gallery in the home page and the home page only, all the other ones will be left centered.
I've been inspecting the code with Chrome and I thought I had it, but nothing changes once I add my code to that specific page:
#collection-type-gallery { gallery-style:Full Bleed; }
Does anyone has experience with SquareSpace?
not exactly the answer I'm looking for.. but I found a workaround.
I created an empty page and added a background (with a snippet of code) to only that page.
(it only works if you want 1 single fullscreen image)
#collection-51b4ef7de4b0_use_your_own_here_62dc3410aaf3
{
background-image:url(http://static.squarespace.com/static/../background2.jpg);
background-repeat:no-repeat;
background-size:cover;
background-position:center;
}
You can call out the homepage specifically by using:
.homepage { }
or you can use a source code inspector and find the unique id as a class on the element and call out any individual page like so:
.collection-51b4ef7de4b062dc3410aaf3 { }
I know this can be done with custom CSS, but I can't figure out the right way to do it.
I think I can figure it out for all of them if you show me how to do it with just the title.
For example, this is the element I want to remove: <h1 class="page-title entry-title">
I know that {display: none} is the CSS to hide an item, but how can I do it for only a specific page?
the website is: http://myinneryoga.com/strange-exotic-fruit-supplement/
Use h1.page-title { display: none; } to hide the title, this will affect ALL pages that use the same template.
If you want to do it specifically to this post use the following:
#post-28 h1.page-title { display: none; } the post number will lock it to that page only.
Based on that page, the body has classes
<body class="wordpress... singular-page singular-page-28 layout-1c"
28 is the page id of that page, so if you just want a CSS fix for this, you can use the code below
.singular-page-28 h1.page-title{
display:none;
}
note, if you move the wordpress to another webhost, via export/import, you'll need to look at the page_id again if it changed
See this fiddle, if this is the way you want it.
http://jsfiddle.net/Qj4Us/
It simply looks for the targetted URL like "http://myinneryoga.com/strange-exotic-fruit-supplement/" and if found, hides the h1 with class=page-title
Instead of modifying CSS which will affect all pages we can make use of simple plugin. Below are the steps :
Click on Plugins > Add New.
Now search for Hide Title.
Install and activate the plugin.
Now click on Pages > All Pages.
Now edit the particular page where you want to hide the title.
Now, In the right panel you can see an option to Hide title. Check that and publish your changes.
Im trying to create a better way of letting the user know what page they are on by telling my global navigation to stay one colour. What I mean is if the user is on the home page I want the word "Home" to stay blue for example so that they know thats the page they are currently looking at.
Im not sure if i've explained it very well but if you take a look at the jsfiddle bellow it'll make more sense.
http://jsfiddle.net/4kUp3/
If you don't want to just hard code the style into each page to highlight the item, you could use jquery to grab the element that links to the current page and change it's style
$('a[href="'+window.location.href+'"]').parent().addClass('selected_link');
You could compare each link in the menu with the current page URL. With jQuery:
$('#site_nav li a').each(function(){
if($(this).attr('href') === window.location.href) {
$(this).parent().addClass('selected_link'); // apply style to li
}
});
DEMO
You have it setup correctly, the order on your CSS is just messed up a bit.
Change
.selected_link li a:link
to
.selected_link a:link
and HOME will be blue.