Drupal 7, how to push a div below the js files - javascript

I need to push a div right above the end of the body tag, but there are allways scripts above it and i need it below of them
I already tried:
I tried to use Hook_page_build to push them but it allways comes above the js files.
I also tried page_alter
I gave it 999... weight to see if something happens but nothing
I also tryed to put it in a drupal_add_js(' .. '), but it is wrapping them with "".
Any ideas ?
Thank You

A solution could be to use the template file https://api.drupal.org/api/drupal/modules!system!html.tpl.php/7 and add the div there.
https://www.drupal.org/node/1089656 - generic documentation about templates
In your case, you might copy html.tpl.php to sites/all/themes/[yourtheme]/templates/ and to the modification there to have the div where you'd like.
If you use a sub-theme of the main theme, copy the html.tpl.php from your main theme, instead of Drupal core.

drebabels has the same question on Drupal Answers https://drupal.stackexchange.com/q/19132/48277
Kiamlaluno's answer explains how to achieve that using hook_page_build() : https://drupal.stackexchange.com/a/19134/48277
However, his answer is working if your theme has a similar structure in html.tpl.php. Use it as an example.

Related

How to remove/reset external css styles with JQ?

I want to reset remove or make initial all the css properties defined in an external css file. I want the solution should also work when I edited/added/removed properties in css file.
So solutions in here don't work.
For example $('div').css('width','');, is not a solution cause it clears the width property in a HARDCODED way.
Also solutions like $('div').attr('style',''); does not work cause I do not use inline styling, also again $('div').removeClass(''); is not a valid solution.
Any answer would be appreciated, thanx.
You can playaround the code here: http://codepen.io/ertugrulmurat/pen/JEhfe
And; How to dynamically remove a stylesheet from the current page is not a solution, another side effect of this is that it removes all styles for all elements, this is not the case wanted
Just use this $('link[rel=stylesheet][href~="external_css_link.css"]').remove(); and remove the link of the css file which you don't want in similar manner you can again add the file
UPDATE
I tested the same in local file system where css is other file and run the same code and found that the style is removed completely and it behave in complete different manner as it working in the online javascript editor jsfiddle or any other because they internally include the css in the page they don't include the an external link thats why
$('link[rel=stylesheet]').remove();
not work here in your sample
in other way it remove the style completely

jQuery remove div by ID on load

I'm trying to remove an entire div on page load. Currently I'm trying to use:
$(document).ready(function(){
$("#removeme").remove();
});
with the HTML
<div id="removeme">If JS enabled remove this!</div>
I've been searching for hours, using many variations including getElementById. No luck.
Javascript/jQuery aren't languages I use often.
All help is appreciated. Thanks!
Edit: Fixed, page I was adding it to was having some issues (another dev built it). I put the code into an existing JS file instead and it works. Thank you all.
$('#remove').html('');
or
$('#remove').empty();
That will remove that text if JS is enabled.
The code you are showing in your question works, as proven by #barmar :
"http://jsfiddle.net/barmar/epsZe/"
If it doesn't work for you, it is most likely because you have an error in your Javascript before you reach the code displayed here. Also, ensure that you have included Jquery before-hand.
To find where previous errors could have happened, you can look inside your Javascript console. Here is a question where it is described where to find your console on most browsers :
What is console.log and how do I use it?
If you don't want to use the console, you can put alerts in your Javascript code until you find where they stop displaying.
try this
$("#removeme").replaceWith("");

How do I edit Liferay's HTML code?

I was wondering if it's possible to edit Liferay Portal's HTML code, add a couple of <br> to have more space between portlets. Or even add some Javascript to it?
Is this possible? If so, how?
Thanks
You can create your own theme, extending another theme (e.g. classic, _styled, etc.) and adding the 'diff' files, aka the ones you want to extend. In that case, you could extend a default css files, adding a rule like:
#content .portlet-layout .portlet-column-content {margin: 10px;}
Another quicker but less flexible approach is to use the
'Insert custom CSS that will be loaded after the theme.'
feature. This can be found at: Manage Pages > Look & Feel > CSS
The Theme answer has already been given - if you just want to change the appearance (e.g. linebreaks) this is the way to go instead of your original question to change HTML output.
If you literally need to change the HTML code - e.g. add something to or remove something from the page, you should read about Hooks, particularly those that can override jsps. This is exactly what they've been built for.

jquery files conflicts how to detect?

Q:i have a general problem ,when i wanna to do some thing and i find the jquery file which can do exactly what i wanna to do . after a while i need another case and i find that another jquery file serve me and fix my problem .after i add set of jquery files i find conflicts among those files and some features does not work or work in awkward manner ..and when i try to find which file exactly the source for those problems i find myself in closed circle cannot modify this file or cannot delete this file or cannot find that file itself at all.sometimes the file like this:
<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.js" type="text/javascript"></script>
cannot modify it.
the problem has many faces,and i cannot really know how to handle the whole matter from the beginning.
can any one give me instructions ,advices,notes, or explanation to prevent the problem from the beginning and how to fix it if it was happened.
Please have only one instance of Jquery Library.
The library has the capability to solve the issues.
Seperate instances or files will confuse the code.
I hope this helps.
If you point your browser at http://jqueryjs.googlecode.com/files/jquery-1.3.js it will give you the JS file for you to download and save as your own copy. You can then change it as you want and link it in your website rather than use the one located at googlecode.com.
http://api.jquery.com/jQuery.noConflict/
This link suggests few of the ways to avoid the jQuery conflict. Please check that as it could give you some more idea to resolve your problem.
Regards,
Lakxman Kumar C

Use VIM omnicomplete for javascript with ctags

I am using vim/gvim for 4 months already and now I found a way to use it's strengths.
My tags file is generated very well and here is a simple row in it.
my.namespace.classname /path/to/file.js /^my.namespace.classname = function(first_arg,$/;" f
Here is an example what i need to omnicomplete:
my.namespace.cla <- omnicomplete list with all classnames in the my.namespace
The above is the key to my problem, because it looks like omnicomplete searches only namespace without including "my." in front of it. So i see other element in the omnicomplete list and not my classname at all.
However, if i type :tag my.namespace.classname for example gvim opens the correct file at the correct position.
What is wrong and how can I make it work?
I've noticed that a lot of omnicomplete is not well developed. I've used the php omnicomplete and have had to go in and tweak a lot of it to get it working correctly. I recommend you download omnicomplete for javascript. Then add it to your plugins directory. Then make edits to it until it does what you want it to do.
Sorry I couldn't be of more help - but at least you won't go answerless any longer.

Categories

Resources