I need to hide a custom field created by a theme only in a specific page.
I am using a code that works perfect in another site but in wordpress seems to not working and i can't spot why not. The code loads as far as i can see in source page. I have added the code directly into the theme header.php file and this is the code
<script type="text/javascript">
$(document).ready(function() {
if (window.location.href.indexOf("https://www.demosite.com/advanced-search/?adv_location=&bedrooms=&bathrooms=&filter_search_type%5B%5D=residential-land&filter_search_action%5B%5D=&price_low=0&price_max=9900000&submit=Search&elementor_form_id=18618") ){
$('#property-size-ft2').hide();
}
});
</script>
Ideal case would be to have the ability to create a custom advanced search per each page but this is not possible, that is why i created all the custom fields and now i want to fine some of them, depending on he actual page they are displayed.
Related
I have a scenario in which I want to test four different versions of a page, each with different javascript content loaded in the HTML head section.
I would like switching between the templates to behave as though the page has been re-loaded, clearing the state and re-running the JS in the head and body of the HTML file.
Can I do this with four different Meteor templates?
The way I'd do this is to append the JS to the head from within the template's onRendered method, like so:
Template.templateName.onRendered(function() {
$('head').append("insert your script here");
});
So I'd keep the default head free of any of these js files, and just add them in depending on what template the user is on. You can also manipulate the user experience from within the onRendered method as well, using things like $(window).scrollTop(0) to make it appear as though the page has refreshed.
how to change title without refresh or reload ? It can be changed by jquery but effect will not be done on view source.
i've use document.title. On browser it is changing value but when i open page source it shows blank.
There is no way to change the source of a page with (client-side) JavaScript. The source is the raw code that was delivered to the browser.
You can change the current DOM, and a DOM viewer (such as you can find built into most browser Developer Tools) will show you a serialization of the current state of the DOM.
...but when i open page source it shows blank.
Could you elaborate? I've just tried this myself and it works fine:
<head>
<title>Abc</title>
</head>
$(document).ready(function() {
$('title').text('test');
})
When viewing the source of the page the title now contains "test".
JSFiddle example.
I am trying to access the HTML code source of AJAX dynamically loaded content. How could I do it?
For example on Gmail, I am trying to access the HTML code of a given email discussion's content (the different entries of a given email discussion) which is loaded only when I click on this email discussion's line in the main list. The code source I can access is only the one of the page initially loaded (the list of all email discussions). Any idea?
Right-click on the page and select "Inspect Element". The element view is updated when JavaScript makes changes to the page, whereas the "View Source" view only shows content from when the page was loaded.
If you right click -> "View Source", it will show you the contents of a reloaded version of the page you are on.
Using "Inspect element" (hotkey CTRL+SHIFT+i) in Chrome shows the source of the dynamic content.
I think you want to bind event on the dom element that loaded after initial page load using ajax. If so then you can use jQuery library and you can use live method of jquery.
Here is a link for live method, you can check that.
http://api.jquery.com/live/
What you need
Download jquery latest library (http://docs.jquery.com/Downloading_jQuery)
and then include it in script within head
or you can use cdn http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js
then do like following
<script>
$(document).ready(function(){
$("#ajax_dom_element_id").live('click_or_any_event',function(){
code snippet you wan dot
});
});
</script>
I think it will be helpfull.
I need to make a series of webpages. Each with a header coming from a website, and the content coming from an html page in my dropbox/public. I simple way would be to use frames, but they are deprecated.
As the html content is of different size. So the iFrame does not seem to be the right tool.
What alternatives do I have?
Many people seemed to suggest in the comments ajax with jsonp. Unfortunately I am completely new to those methods, so I would need an example to copy and then work with.
Thanks,
Pietro
You need to have the Jquery library in the main page. Copy the above code on the header of your page:
<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
The make a div with the response id:
<div id="response"></div>
JQuery has an AJAX function called "load", this function is appended to a selector where you want a page to be loaded, in this case we want to contents of file "exemple.html" to load in the tag with id "response".
<script>
$(document).ready(function(){
// load exemple page when the page loads
$("#response").load("exemple.html");
});
</script>
Also you can load the content when a link from the main page is clicked:
<script>
$("#exemple").click(function(){
// load exemple page on click
$("#response").load("exemple.html");
});
</script>
For this you have to add on your HTML code a link with the id="exemple"
Click to load the exemple page
Hope this helps you!
i am making side all pages static html
i want to make footer another page and i want to show all my web page
because when i have to make change in footer then i will have to change all of my web pages its so difficult i want when i change one page it will appear all pages
how can i do it please help me i am using html pages
Thank's
There is no way to use this using straight HTML - you will need some server side technology - PHP, ASP, Server Side Includes, etc.
Here is a pretty basic break down of some of the options. http://webdesign.about.com/od/ssi/a/aa052002a.htm
Sure no problem. when testing from your hardrive IE will bring the content in, google will not. from a website all browsers will work.
add this to the bottom of your html pages:
<span id="include_footer"></span>
then add a jquery ajax call to get the footer data and replace the span content in the head of html page:
<script type="text/javascript">
$(document).ready(function () {
//include the footer html
$.ajax({
url:"footer.html",
context: document.body,
success: function(response){
$("#include_footer").html(response);
},
error: function(response) {
alert('error loading file');
}
});
});
</script>
Enjoy :)
I see that you're using HTML. Have you considered using PHP? All you need to do is change your page to .php instead of .html and you have a php page. Now, if you make a page, say footer.php, on each of your pages your can add this line:
<?php include 'my/file/path/footer.php'; ?>
Anything that you have in your footer.php file will be included in that page.
Common web servers allows you to prepend or append contents to all pages on particular web app.
For instance in IIS, you can select a an html file for every document you web server returns:
it could be found in the IIS website/app properties then in Documents tab.
For Apache Server:
http://perl.guru.org/scott/hobbies/apache/
For purely static HTML, some IDEs can handle this effectively. In Dreamweaver, you can create a template that your site will use. This template can include an editable section and a non-editable section that contains your footer. You then create pages based on this template. When you update the template, Dreamweaver will handle updating all other pages on your site that are based on that template.
Edit: This is an example of a template in Dreamweaver that I made a couple years back for a group project.
The Bobs (Screenshot)
The area surrounded by the blue-green rectangle is the editable region (for pages created based on this template).