Hide link title with css

How can I hide the title attribute with CSS?

Solution: from what i understand, you need to remove title only from blog page. Meaning, at 767px, the element without the title attribute will be set to display:none, and the one with the title would be set to display:block (or whatever), and the opposite for over 767px.

How can I hide the title attribute with CSS?

I’m working on WordPress site which I have modified the main menu to have the logo placed in the center which links to the home page. I’ve used a to achieve this. I have given it a title attribute of home so that when the responsive menu kicks in at 767px it reads Home and not blank. Until it reaches that break point, I want it not displayed so it only shows the logo. I’m having trouble finding the right CSS

you can see the page here http://s513195336.onlinehome.us/

and this is the CSS I’m trying to work with

ul#menu-main-menu li#menu-item-3377 a title

I feel like I’m close because if I remove a title the menu item disappears.

Читайте также:  Php вернуть xml ответ

What you will need to do is create two elements, one with the title and one without, and show or hide the desired element with media queries. Meaning, at 767px, the element without the title attribute will be set to display:none, and the one with the title would be set to display:block (or whatever), and the opposite for over 767px. Make sense?

This is easily found with the browser inspector. I prefer Chrome. Right-click on the item you want to inspect, and make sure you have the right tag. You will see the css in the inspector for that item. If you hover the section on the top right part of item inspection, a caption will appear with the exact address in the root directory.

Use FTP to make changes or your c-Panel

HOVER THE RED AREA

Css — Hide site-title and site-description wordpress on, I want to hide the site-title and site-description on IE9 and lower. I’ve hidden them via the appearance option, so its hidden on Chrome, Firefox, IE10+, but it still appear on IE9 and lower. Browse other questions tagged css wordpress internet-explorer hide or ask your own question. The Overflow Blog The internet’s …

Hide a specific category title in wordpress

I have 5 categories in my wordpress, I was wondering how to hide just the title of one of the categories? I’ve tried some css but haven’t been able to get it to work.

Any help would be very appreciated.

You can use this plugin for that https://wordpress.org/plugins/ultimate-category-excluder/ I wonder that you want just to hide and display whatever time you want.

Php — How to Hide a category title or description at, How to Hide a category title or description at wordpress using jquery or css? Thanks. Stack Overflow. About; Products How to Hide a category title or description at wordpress using jquery or css? Ask Question Asked 11 years, 2 months ago. Modified 8 years, 1 month ago. Viewed 2k times

Conditional CSS to display title on Blog only

I’m trying to hide the page title on ALL pages, except the Blog Roll.

If I make the following changes to the style.css, it will hide the title on all pages, including the blog roll:

According to http://codex.wordpress.org/Conditional_Tags#Testing_for_sub-Pages, in order to single out the Blog Roll, I need to use the following condition:

if ( is_front_page() && is_home() ) < // Default homepage >elseif ( is_front_page() ) < // static homepage >elseif ( is_home() ) < // blog page >else < //everyting else >

So, I apply these conditions, to my code, where the changes successfully worked initially, however it simply does not work. The titles change size and shape, but are still visiable on ALL pages.

h1 < if ( is_front_page() && is_home() ) < Display:none; font-size: 48px; margin: 33px 0; >elseif ( is_front_page() ) < Display:none; font-size: 48px; margin: 33px 0; >elseif ( is_home() ) < font-size: 48px; margin: 33px 0; >else < Display:none; font-size: 48px; margin: 33px 0; >> 
.entry-title < if ( is_front_page() && is_home() ) < Display:none; font-weight: normal; margin: 0 0 5px; >elseif ( is_front_page() ) < Display:none; font-weight: normal; margin: 0 0 5px; >elseif ( is_home() ) < font-weight: normal; margin: 0 0 5px; >else < Display:none; font-weight: normal; margin: 0 0 5px; >> 

Can I not use Display:none; in a conditional statement or something?

from what i understand, you need to remove title only from blog page. the easiest way to do this with css is

where .blog is the class name of your blog page body. (you can get the body class name by inspecting elements.)

How can you hide the title tag using CSS?, Try article#node-13 h2.title < display: none; >, this will only hide the title element if it is inside node 13, If you would like to hide the entire article then you could do this: article#node-13 < display: none; >. Please note that display: none; completely removes the element from the page flow, this means that the element … Usage examplearticle#node-13 h2.title < visibility:hidden;>Feedback

Hide Title tag on image Hover

I would like to hide the image title tag when hovering an image as they aren’t needed on my website. I have tried this code below and added it above the closing in header.php but it doesn’t work.

I don’t have to download a plugin to achieve this. The title tag doesn’t have an impact on SEO so there shouldn’t be an issue with hiding it.

Would someone be able to tell me why my script isn’t working and what I can do to make it work please?

This is the code I have tried in my header.php above the closing

  

Check Errors in console by pressing F12, Your code is correct but WordPress sometimes don’t understands $, Use jQuery instead of $.

 jQuery(document).ready(function($) < jQuery('img').hover(function() < jQuery(this).removeAttr('title'); >); >); 

There’s no need for jquery. Sole CSS can do that:

How can I hide the title attribute with CSS?, 0. What you will need to do is create two elements, one with the title and one without, and show or hide the desired element with media queries. Meaning, at 767px, the element without the title attribute will be set to display:none, and the one with the title would be set to display:block (or whatever), and the …

Источник

Solution 4: In CSS it’s not possible, because you can only add contents to DOM (tipically with and , not remove or change attributes. Solution 1: Created a simple image for you on how to get page id and menu attributes. https://dl.dropboxusercontent.com/s/zibhieyo3s6a5bs/Mailbird_2017-01-27_00-57-39.png You need to get the page_id, exactly as you did: and hide the menu, like so: You forgot the # sign, which stand for html attribute Solution 2: I was having the same issue.

How to hide menu element with only CSS

I have these menu elements I am trying to hide but I cannot seem to only select the middle option called ‘Contact’. I cannot edit the html directly so am using CSS to override the style.

Essentially I just want to hide the item called ‘Contact’ from appearing. How do I select it using CSS? I have put what I thought might work in the section, but it’s not really working. Any help would be greatly appreciated. Thanks in advance. (Here it is as well: https://jsfiddle.net/amhzv0Lw/4/)

You only have to replace : with = , because that’s how css selectors work (reference here)

Your code should look like this

You can make use CSS nth-child selectors this way:

Or may provide a CSS class to that «Contact» list-item, and hide it with CSS:

HTML
CSS

EDIT : Note that the below CSS will hide only the hyperlink, not the list-item:

Here, it works : See this fiddle

please check out the fiddle : https://jsfiddle.net/amhzv0Lw/9/

Html — How to hide menu element with only CSS, There are two methods of doing this-. Method 1- Targetting the li through nth-child selector property. .nav li:nth-child (2) < display: none; >Method 2 … Code sample.nav a[title=Contact] Feedback

I have an anchor element with a title attribute . I want to hide the popup that appears when hovering over it in the browser window. In my case, it is not possible to do something like this,

Because of jQuery Mobile the title will reappear after certain events occur (basically everytime the anchor element gets redrawn). So I hope to hide the title via CSS.

doesn’t work, since it hides the entire anchor element. I want to hide the title only. Is this even possible? The popup shouldn’t display.

Using the following CSS property will ensure that the title attribute text does not appear upon hover:

Keep in mind that JS is a better solution since this CSS property will ensure that the element is never the target of any mouse events.

As per @boltClock’s suggestion, I’ll say I don’t feel that a CSS solution is appropriate here, as the browser decides what to do with the title attribute of a link, or anything for that matter. CSS, to my knowledge, is unable to handle this issue.

As mentioned, using jQuery to replace the title with an empty string wont work because jQuery mobile rewrites them at some points. This, however, will work independently of JQM, and doesn’t involve entirely removing the title attribute which is SEO important.

$('a["title"]').on('mouseenter', function(e)< e.preventDefault(); >); 

I changed my initial code of $(‘body’).on(‘mouseenter’) to this after testing. This is confirmed to work.

You can wrap your inner text in a span and give that an empty title attribute.

In CSS it’s not possible, because you can only add contents to DOM (tipically with :before :after and content: ‘. ‘; , not remove or change attributes.

The only way is to create a live custom event (es. «change-something» ):

and trigger to every changes:

More information and demo here:

Is it possible to hide the title from a link with CSS?, In CSS it’s not possible, because you can only add contents to DOM (tipically with :before :after and content: »;, not remove or change attributes. The only way is …

Hide text using css

I have a tag in my html like this:

Using css I want to replace the text with my actual logo. I’ve got the logo there no problem via resizing the tag and putting a background image in via css. However, I can’t figure out how to get rid of the text. I’ve seen it done before basically by pushing the text off the screen. The problem is I can’t remember where I saw it.

Here is another way to hide the text while avoiding the huge 9999 pixel box that the browser will create:

Just add font-size: 0; to your element that contains text.

The most cross-browser friendly way is to write the HTML as

then use CSS to hide the span and replace the image

If you can use CSS2, then there are some better ways using the content property, but unfortunately the web isn’t 100% there yet.

Hide text using css, Here is another way to hide the text while avoiding the huge 9999 pixel box that the browser will create: h1 < background-image: url (/the_img.png); …

Hiding Menu From Specific Pages

I’m trying to hide the menu page completely from this page:

I’m using Divi 3.0, and have tried – through online tutorials – to hide it using the following in my styles css sheet:

That didn’t do anything, aside from making the menu look a little weird (and dropping the search magnifying glass down a bit), and I removed the code – the search button still looks weird.

if anyone could help me with how to remove the menu completely (and logo etc) from that one page, I’d be very much appreciative!

Created a simple image for you on how to get page id and menu attributes . https://dl.dropboxusercontent.com/s/zibhieyo3s6a5bs/Mailbird_2017-01-27_00-57-39.png

You need to get the page_id, exactly as you did:

and hide the menu, like so:

You forgot the # sign, which stand for html attribute id

I was having the same issue.

I pasted below code to custom css in divi theme

.page-id-28577 = body class of the page that I don’t want to show menu on

Go to header.php and find the wp_nav_menu(); function.

You could wrap it in a check for the current page. $post is available as a global variable.

post_name !== 'splash-page'): ?> 

Hiding Menu From Specific Pages, I’m using Divi 3.0, and have tried – through online tutorials – to hide it using the following in my styles css sheet: .page-id-27820 top-menu-nav < …

Источник

Using the following CSS property will ensure that the title attribute text does not appear upon hover:

Keep in mind that JS is a better solution since this CSS property will ensure that the element is never the target of any mouse events.

Solution 2

As per @boltClock’s suggestion, I’ll say I don’t feel that a CSS solution is appropriate here, as the browser decides what to do with the title attribute of a link, or anything for that matter. CSS, to my knowledge, is unable to handle this issue.

As mentioned, using jQuery to replace the title with an empty string wont work because jQuery mobile rewrites them at some points. This, however, will work independently of JQM, and doesn’t involve entirely removing the title attribute which is SEO important.

$('a["title"]').on('mouseenter', function(e)< e.preventDefault(); >); 

I changed my initial code of $(‘body’).on(‘mouseenter’) to this after testing. This is confirmed to work.

Solution 3

You can wrap your inner text in a span and give that an empty title attribute.

Solution 4

In CSS it’s not possible, because you can only add contents to DOM (tipically with :before :after and content: ‘. ‘; , not remove or change attributes.

The only way is to create a live custom event (es. «change-something» ):

and trigger to every changes:

More information and demo here:

Solution 5

try to change your code using this

this will remove title attribute so the hint label won’t be appear when hover on the link

Источник

Оцените статью