Site logo

Archived topic

Tooltip

10 replies · Started by Stephanie on August 15, 2015

Viewing posts 1–11 of 11

Hi Tom,
Can you tell me how to create the tooltip background you have in section 2 of Generate Press.

Thanks

Hi there,

Not too sure what you mean? Could you take a screenshot possibly?

Hey Stephanie, for the tooltip you will need a custom css class and a tooltip image.

For the tooltip here in GP site the css used is this:

.home-info-section {
	background-image: url('URL TO YOUR ARROW IMAGE')!important;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: auto;
}

Just place home-info-section into your section CUSTOM CLASSES, upload the image to your site and change the URL in the code above.

To add CSS follow this tutorial: https://generatepress.com/knowledgebase/adding-css/

Jean

Hi Tom,

The section that says:

Responsive, Multipurpose WordPress Theme

GeneratePress is lightweight, powerful and easy to use!

I place the photo in my section background but the bottom point is not showing.I also used the instruction that Jean give, that still did not work. I am missing something not sure what.

Jean thanks for your help.

The instructions Jean gave above should be perfect.

Any chance you can link us to the page so we can inspect the code?

As I can see you want to display the tooltip in the section below. Your image should be just uploaded to your media library, not as section background.

Also your image must be only the tooltip like this:

And you need to add the custom class home-info-section to your 4th section. Hope that now is more clearly the steps.

Jean, that worked. Thanks Again!

Hey Jean / Tom

Followed the exact steps you gave.

Can you see why the arrow isn't coming up for me?

Your CSS is:

background-image: http://solarsellmarketing.com/wp-content/uploads/2016/02/Solar-Marketing-Tips.png!important;

It should be:

background-image: url( 'http://solarsellmarketing.com/wp-content/uploads/2016/02/Solar-Marketing-Tips.png' );

This archived topic is closed to new replies.