I want to display image and link in sub menu, i tried menu icon module, but i can not able to display both image and link.
can any one know which module support both?
i found one drupal website which uses the same, sweetdigital.co
I have done this before by overriding theme_menu_link to add a wrapper and a unique id, then just used css to add the image using the unique id as the selector.
Related
My basic requirement is to display one picture on a page which on clicking, displays a colorbox slideshow of all the pictures in that content type.
https://www.drupal.org/node/1026112
This is the solution I got for it. To apply display:none css for the rest of the images. For that, I need different classes for the images. I'm unable to figure out how to do so.I got a few solutions such as adding a preprocess_image function but it doesn't seem to work. Can I get some help here?
We did this in past using the "Image sets" option provided with the Lightbox2 Drupal module. We had a client request to show one image and then open a slideshow on the same page of the images associated with that content in the CMS. This module say:
If you have a set of images that you would like to group together in a
lightbox, but only wish for one of these images to be visible on your page, you
can assign the "lightbox_hide_image" class to hide the additional images. For
example:
image #1
image #2
image #3
You can create a custom node template to render the images in the required format.
Hope this will help you!
I have a requirement to create a custom navigation bar to replace the existing on a WordPress site. I have decent at CSS but have never come across something like this.
I have found multiple ways to remove the existing navigation bar so that is not a problem but adding the svg with links that are relative to the svg is.
The navigation bar is supposed to look something like this
navigation bar
I think you can approach this from two different angles.
1 - You don't want to/can't use PHP
You can create a custom menu through Wordpress' admin panel.
Add specifics classes to buttons (by activating CSS class property field on menu's buttons using "screen options" panel : ont the right top corner of the page).
Then you sould need 2 classes :
one class for the links on the first row (who/what/how)
another class for the link on the second row (contact)
and adjust de CSS rules to display links as you want.
Finaly I would display the "cloud" svg as the background of the whole menu.
The real problem is that wordpress will output all menu items as li in a ul, so maybe you should create 2 differents menu (one per row), and display the two menus in a dedicated container.
2 - You want/can/prefer to use PHP
This alternative takes advantage of Wordpress' Menu Walker by creating a custom walker extending it
The idea is that by customizing this PHP class you can specify how you want wordpress to render you menu(s) by defining the HTML output.
Here is some links to help you do that :
https://gist.github.com/kosinix/5544535
https://code.tutsplus.com/tutorials/understanding-the-walker-class--wp-25401
http://jamescollings.co.uk/blog/wordpress-custom-walker-output-section-of-menu/
Once you custom menu output is OK, you just need to customize the generated HTML though CSS.
Note: the second approach can be an adventure if you're not comfortable enough with PHP
This is a wordpress website designed by a third party which I am doing some amendments to.
I'm trying to add a new menu item called 'news & events' which links to all posts categorised with that name. Problem is the css isn't styling the link as per the rest of the navigation links (font / speech bubble on rollover). I've added new lines of code to style.css but it's not picking up on the styling.
I did a test and added one of the existing links again to see how the css behaved, and that dropped out too. It seems like no matter what link I put in, the css styling won't apply to it.
Does anyone know why this is happening?
looks like you have each of the menu items getting assigned from its own style.
if you were to give it the class "nav-opinion" to the list item containing it this would work fine. what I would probably do is give a class to all of the side menu items instead of doing them each individually.
Solved it. In Wordpress there is a hidden menu for css classes. In there I added nav-opinion tk-museo-slab and now it works!
In my WordPress menu I want different images for different menus with text as well. Here is the image reference. I want my menu should be like this.I am using WordPress 3.4.2. Any help and suggestions are highly appreciable.
Update
The screen options image
Here are two ways on how you could add custom classes to your menu items, so that you could style them with CSS.
When on the Appearance > Menus page in Wordpress admin panel, click on Screen
Options at the top-right of the page. A slide-out menu appears and
allows you to check an option labeled CSS Classes. If you enable
this option, you will be able to add a custom class to each menu
item, the same way as you add its title.
You can customize the Walker class to add an incremental class name
to each (top-level) element. To see how the Walker class works,
please take a look at the following article:
http://wp.tutsplus.com/tutorials/creative-coding/understanding-the-walker-class/
Use image sprites
Use a different class for each of your <li> item
Position your images as background for that classes.
i'm new to drupal views. More link not displayed with my view block. i set more link both Create more link and Always display more link option too. Find picture below for view settings.
Note: i'm sure there is around 10+ nodes available to display.
You have only block display, so where should go "More"? :) Create also "Page" display.
If you have specific page to link on more then you can use header or footer also
1. Add Global Custom Text in Header or Footer
2. Put Your Link There.
That is alternate way for more link