How to do a mouseover on wordpress? - wordpress

With Images
http://i.imgur.com/snv3pEE.png
I just can do like this:
http://i.imgur.com/D6Hr6fB.png
code:
<img class="tooltip" title="HERE THE TOOLTOP" alt="" src="img.png">
And I can't put images on title=""

You have to look at the way you approach your information for this. If this is going to be inside the loop you have to include it in your template. I would look into using custom fields and meta-boxes to simplify the backend part.
If you're not too familiar doing this I would look into the http://www.advancedcustomfields.com plugin and within your template put a if statement that will display a div/img and position it. They have some documentation and I would learn the basics of if/else in php. Then I would use a simple mouseenter / mouseleave jquery event to show the hidden div or toggle.

Related

Issue with a wordpress site

Does anyone know why is this thingy showing up on top of our wordpress website, on every single page that you enter - http://sportsabac.org.rs/. Could it be the theme itself that is problematic..? I mean, when I change it - "Twenty eleven" is called, the problem goes away...
The class should be define within tag braces but your class difine outside like
your tag is
class="home blog custom-background single-author two-column right-sidebar">
it should be in
Probably there is closed html tag > just before this part of code.
The class should define within tag braces,
Try this;
<div class="home blog custom-background single-author two-column right-sidebar"></div>
I would like to try that, just as soon as I find out where is it located. This really ain't my thing, just trying my best to fix it.. >.<

Is it possible to append a class to existing div dynamically in wordpress?

I am using the Wordpress theme Avada and I want to append a class to a pagination <div>. Currently it is like:
<div class="pagination clearfix"> and I would like to dynamically be able to add a class to this div like so: <div class="wp-pagenavi pagination clearfix">
Is there a way of doing this? I have searched the theme and cannot find where this <div> is so that's the reason for wanting to change it hopefully somehow dynamically. I hope it makes sense.
Thanks for any help in advance,
Peter
you can do it using javascript, idk about wordpress and if u can get access to the code, but with javascript you can do the following:
document.addEventListener('DOMContentLoaded',function(){
document.querySelector('.pagination').classList.add('wp-pagenavi');
console.log(document.querySelector('div'));
});
<div class="pagination clearfix">
DOMContentLoaded
DOMContentLoaded wait until the Dom is ready and after execute the srcipt

How to add a custom button in Silverstripe editor?

I want to be able to let the user add a styled button in the content editor in silverstripe. They need to be able to edit the text inside the button and also need to be able to link it to another page or website. I believe you can do this using shortcodes or possibly having a button on the tiny_mce editor would be better?
HTML:
<a href="http://www.need-to-be-editable.com">
<div class="ribbon">
<strong class="ribbon-content"><h1>Need to be editable</h1></strong>
</div>
</a>
JSFIDDLE - HTML & CSS for button
For a start that HTML isn't semantic - you've got inline elements around block elements, and unless this button is going to kick off a new section you shouldn't be using an H1 tag.
Ideally you can simplify your link markup to something like this:
<a href="http://www.need-to-be-editable.com" class="ribbon">
Editable text
</a>
Then you can easily apply the 'ribbon' class to the link in the editor, and the link can reside in a P, H1, H2 or whatever is appropriate for the context. Check out this module for some tips on taming the editor if you choose this approach.
If you need the markup to be more complex and include multiple elements then a shortcode is probably a better option. Shortcodable is a handy module for improving the editing experience for shortcodes in the CMS.

css target one page only

I am using an OsCommerce web shop. I want to fade out a sidebar, but only on one specific subpage, but I don't know how. In WordPress you can do it with page ID it think. Is there any way to do this in OsCom or in general with for just one subpage?
Well, I don't know about oscommerce, WordPress and all that stuff (sorry), but I think that, if you know the url (I guess you know it, or you have some placement variable for get it) where you want to apply the fade, maybe you can:
Create a class for the fade transition/animation.
Add an ID to get the sidebar with js/jquery.
Add javascript/jquery code to your site for apply that css class ONLY in that page.
Something like this (with js & jquery):
<!-- language: lang-js -->
if (document.location.href =='http://this.is.my.url/my-subpage') {
$('#mySidebar').addClass('fade');
}
Pure js:
<!-- language: lang-js -->
if (document.location.href =='http://this.is.my.url/my-subpage') {
document.getElementByID('mySidebar').className = 'fade';
}
Here, the sidebar has id="mySidebar" and we set their class to class="fade" only in the subpage http://this.is.my.url/my-subpage.
Hope it help you.

Adding custom CSS to Drupal 7 to hide the message

I use my custom block for displaying a flash game at the front page of my Drupal 7 installation, but there is also the annoying message:
<div id="first-time"><p>No front page content has been created yet.</p>
<div class="item-list"><ul><li class="first last">
Add new content</li>
</ul></div></div>
below it and I can't remove it. Is there please a hook for adding custom CSS? In my module I would like to make the #first-time light grey or invisible.
I prefer not to add a blank content just to get rid of that text.
Thank you!
Alex
UPDATE:
I've added the following to my module:
function game_init() {
drupal_set_message('XXX init called XXX');
if (drupal_is_front_page()) {
drupal_add_css('#first-time {color: green;}', 'inline');
}
}
but don't see that CSS-code or XXX string inside my front page.
UPDATE2:
Oh, I had to clear the cache and now it works (the Drupal docs seem to be wrong here - there was written that 'inline' CSS is not cached...)
Hiding the CSS is the WRONG way of doing it. why did you created your content as a Custom Block?
you should create a "Page" and set this page as front page in the Configuration->Site Information.
Whatever. you can also use any of these options but is not recommended.
you can also also add a BlankPage by Adding only the Title(then hiding it in PHP on page.tpl.php)
you can add your css in /templates/themes/bartik.info
you can call drupal_add_css on the _init() hook of your custom module.
Blocks are used to display information in every page(although we can set to display only on certain pages). Say For Example. A Menu, or A Shopping Cart etc.
If you want to add some CSS for a module, you should use drupal_add_css()
Why not simply add this CSS to your theme?

Resources