Morning,
I have an affiliate external widget i need to place on a page in wordpress.
The official code i have been given loads external content within this page.
<script type="text/javascript" src="http://www.convert.co.uk/widget/mobiles.js"></script>
where you place the line of code is where the external content is displayed.
This works perfectly on a non-wordpress site.
Once loaded the content uses some jquery effects and ajax to swap the results.
If i add this code within a wordpress page, it loads the content fine but the jquery within the external content does not work.
many thanks.
I do not have access the external code to change.
In the backend in the widget screen, drag and drop the text widget in the place where you need to display this external widget. Now, just add the code you have to that text widget and save it. You should now see your widget on the front end
Related
Trying to build a personal website using Google App Script - have set up a main html page, a css page and a js page.
On the main page I have a menu and a main div area where I inject content upon clicking on the links in the menu (so clicking on a link to a YouTube video embed the video in the main div area)
So far so good
Some of the content is text block - a cv, a bio etc - I want to have them in a separate document (so i can edit the easily) and load them into the div area whenever needed. I managed to do this making a google doc but when using the embed code i get a frame and other stuff (like "Published by Google Drive–Report Abuse") that I don't want...
So I thought I can create another html file for each text document (where I can format using html tags etc) and load that html into the div area but I am not sure how to do it...
So I’m quite new to WordPress developing and I’m trying to implement MixClouds API into this website. I’ve managed to make the images load the Mixcloud URL via custom fields in WordPress. When you click on an image, it will load the song into the MixCloud widget that is I have inserted into the function.php of the theme.
https://gamma.itmotr-radio.com/shows
That part works perfectly. Which took me a while, but now the part that I can’t figure out. The script for the Mixcloud Widget needs to be on the entire site. But since the script is loaded, and you want to go to another page, the widget will keep playing (which is good!!) but the page itself stays totally black, none of the pages codes will load, but the widget is still there.
I think this has something to do with the script, and that it stop loading the page itself after the script is loaded. Can someone help? I also tried to put the script in one of the .PHP files like footer.php and header.php. but this doesn't help as well.
— MixCloud Script —
<script src="//widget.mixcloud.com/media/js/widgetApi.js" type="text/javascript">
</script>
<script src="//widget.mixcloud.com/media/js/footerWidgetApi.js" async>
{"feed": "/itmotr-radio/"}
</script>
loads the URL from
<div ... data-mixcloud-play-button="<?php
echo get_post_meta($post->ID, 'mixcloud-url', true);
?>"></pr>
which can be found in the blog/shows page of the website.
If anyone knows how to make the WordPress page loading work again, while this script is still there, please let me know :)
I want to use the Facebook comments box on my WordPress page where I use "handlebars js", which dynamically loads my HTML content with a script on my page.
When I add the Facebook html code:
<div class="fb-comments" data-href="http://mysite/mypage/" data-numposts="5" data-colorscheme="light"></div>
anywhere on the page it works fine, but when I use it within the handlebars script, it does not (except for like 1 time out of 20!).
I have tried changing the Facebook JS SDK to load asynchronously, as I suspect the issue has to do with the order in which my scripts are loaded, but still no luck.
You need to parse the plugin with FB.XFBML.parse after appending the Handelbars content to the DOM. Btw, that´s another topic, but you should ALWAYS load the JS SDK asynchronously, and make sure it is loaded before using FB.XFBML.parse.
Make sure to call the parse function after appending the Template content to the DOM.
I'm creating a one page responsive portfolio site in Wordpress based on the Foundation framework by Zurb. I'm not happy with the Clearing lightbox included in the framework, so I'm trying to include a different lightbox for images/videos (currently using Magnific Popup [http://dimsemenov.com/plugins/magnific-popup/documentation.html], but I've tried a few different plugins, including Fancybox, Colorbox, and the Responsive Lightbox plugin from dFactory).
I have a custom post type called Projects. All of the projects get displayed on the one page website, and when the user clicks on a project to see more information, the_content gets called and loaded into a div dynamically via Ajax (similar to the way portfolio projects work in the SimpleKey Wordpress theme [http://themeforest.net/item/simplekey-one-page-portfolio-wordpress-theme/3729774]).
I can get the lightbox to work on the single.php page if I manually navigate to it (ex. http://www.aisle7Studios/project/project-name/), however when I'm on the main one-page site, I can't get the lightbox to work. I know this is because the content is being loaded dynamically via Ajax, but I can't seem to get it to work. Ideas?
This is the Javascript that loads the portfolio posts, located in header.php
<!-- Items for loading portfolio posts without refreshing -->
<script type="text/javascript">
$(document).ready(function(){
$.ajaxSetup({cache:false});
$("h6 a").click(function(){
var post_id = $(this).attr("rel")
$("#singlePortfolioPost").html("loading...");
$("#singlePortfolioPost").load("http://<?php echo $_SERVER[HTTP_HOST]; ?>/portfolio-item/",{id:post_id});
return false;
});
});
</script>
<!-- End Portfolio Post load-->
This is the div where the post content gets loaded, located on the Portfolio page.
<div id="singlePortfolioPost" class="large-12">
</div> <!-- .singlePortfolioPost -->
The content loads fine, and upon examining the code, I can see that the plugins that automatically add rel="lightbox" to anchor tags work the way they're supposed to. However the lightbox plugins just don't work...they simply take me to the media file I clicked on.
I have 2 html page (main and details): the main page consists of a table and a empty div. When the user clicks one a table row, the empty div is filled via AJAX from another page (details page).
On the details page I want to load a Google Map. Also I would like the page to be operational by itself (standalone), not just via AJAX.
So here is my problem:
To use Google maps I have to include this script in head of html:
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
If I include this in the details page, it works fine standalone. But it doesn't work when I try to get it via AJAX from main page. Google server hangs, and doesn't progress.
On the other hand, if I include it in the main page, AJAX works fine, but the details page is not operational on its own, since its missing a vital include.
I'd really like to leave it in the details page, since it has much more logic to be there. Is there any way I can load the script in the main page, from the details page?
Generally what is the best approach with javascript including and AJAX? Keep everything in main page? Or is there any mechanism to load everything into main page, but keep the code in ajaxed pages?
Btw. I'm using jQuery, but it is not really important. This is a design issues, not a library problem.
Since you are not using IFRAME, it is best that you include the JAVASCRIPT in the main page rather than detail page - since you can do and the js will work. This I think will fix the ajax issue for you and the script is loaded once.