I try to embed my Podio Form in to this wordpress page however it's just show / < ![CDATA[ // < ![CDATA[ // as in the picture above
Here is the code that I used:
[av_textblock size='' font_color='' color='']
[:vi]
[/av_textblock]
[av_codeblock wrapper_element='' wrapper_element_attributes='' custom_class='']
<!-- BEGIN Podio web form -->
<script src="https://podio.com/webforms/15016309/1006763.js"></script>
<script type="text/javascript">// < ![CDATA[
// < ![CDATA[ _podioWebForm.render("1006763")
// ]]></script>
<noscript>
Please fill out the form
</noscript>
<div class="podio-webform-container">A webform by <a class="podio-webform-inner" href="https://company.podio.com/project-management-software">Podio</a></div>
<!-- END Podio web form -->
[/av_codeblock]
[av_textblock size='' font_color='' color='']
[:en]
[/av_textblock]
[av_codeblock wrapper_element='' wrapper_element_attributes='' custom_class='']
<!-- BEGIN Podio web form -->
// < ![CDATA[ // < ![CDATA[ //
<!-- END Podio web form -->
[/av_codeblock]
[av_textblock size='' font_color='' color='']
[:]
[/av_textblock]
Anyone can help me?
You have the form render function commented out and prefixed with < ![CDATA[
You also have it wrapped with [av_codeblock wrapper_element='' wrapper_element_attributes='' custom_class=''] which I'm not sure what that even is; but it might cause rendering issues.
<!-- BEGIN Podio web form -->
<script src="https://podio.com/webforms/12345/6789.js"></script>
<script type="text/javascript">
_podioWebForm.render("6789")
</script>
<noscript>
Please fill out the form
</noscript>
<div class="podio-webform-container">
Get your free webform from Podio
</div>
<!-- END Podio web form -->
From looking at your code snippet, the format of the webform embed code looks different from what we would expect to be generated by Podio. For example, if I export a webform on a demo app the code looks like this:
<!-- BEGIN Podio web form -->
<script src="https://podio.com/webforms/12345678/1234567.js"></script>
<script type="text/javascript">
_podioWebForm.render("1234567")
</script>
<noscript>
Please fill out the form
</noscript>
<div class="podio-webform-container">
Get your free webform from Podio
</div>
<!-- END Podio web form -->
As a starting point, please navigate to your App in Podio, select the wrench icon from the top left, and the select Webform. Enter the domain of your website in the provided field, and copy and paste the provided embed code directly into your Wordpress HTML. Here if a helpful video that walks through this process.
Related
I am trying to load a dicom image using cornerstone library. I get an error - uncaught exception: loadImage: no image loader for imageId.
I have my image file named as image-1.dcm. What am I doing wrong?
Here is my code:
<!DOCTYPE HTML>
<html>
<head>
<!-- twitter bootstrap CSS stylesheet - not required by cornerstone -->
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<h1>
jsminimal/index.html
</h1>
This is an example of the minimal use of cornerstone driven by javascript
<br>
<br>
In this example, javascript is used to image enable a div.
<br>
<br>
<div id="dicomImage" style="width:512px;height:512px;">
</div>
</div>
</body>
<!-- cornerstone depends on jQuery so it must be loaded first-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- include the cornerstone library -->
<script src="cornerstone-master/dist/cornerstone.js"></script>
<!-- include special code for these examples which provides images -->
<script src="cornerstone-master/example/exampleImageIdLoader.js"></script>
<script>
$(document).ready(function() {
var imageId = 'image-1';
var element = document.getElementById('dicomImage');
cornerstone.enable(element);
cornerstone.loadImage(imageId).then(function(image) {
cornerstone.displayImage(element, image);
});
});
</script>
</html>
You need to use the cornerstoneWADOImageLoader to loader DICOM P10:
https://github.com/chafey/cornerstoneWADOImageLoader
How can I integrate social content locker in blogger blogs? We see in numbers of WordPress blogs and websites,
But in blooger.com blogs you see no plugin option
does anybody has another way or something like this?
I Want visitor to like, tweet or g+ before reading my posts.
thanks
I found this working script for this what you need to do is first backup you template.
then edit HTML >search <head> tag and put this code after <head>
<script src='http://code.jquery.com/jquery-1.10.2.min.js' type='text/javascript'/>
After that search </head> tag and put below code before this tag
<link href='https://sites.google.com/site/menightfury/home/social-locker/public/sociallocker_v1.6.0.css' rel='stylesheet'/>
<script src='https://sites.google.com/site/menightfury/home/social-locker/public/sociallockermin_v1.6.0.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function ($) {
$('#default-usage .to-lock').sociallocker({
buttons: {order:["facebook-like","twitter-tweet","google-plus"]},
twitter: {url:"https://www.facebook.com/www.mostsharedposts"},
facebook: {url:"https://www.facebook.com/www.mostsharedposts"},
google: {url:"https://plus.google.com/u/0/b/110589424466302901501/110589424466302901501"},
text: {
header: "Like us To Unlock This Content",
message: "This content is locked. Like us on Twitter, Facebook or Google plus to unlock it."
},
locker: {close: false, timer: 0,},
theme: "secrets"
});
});
//]]>
</script>
this is how to hide your code in post editor
go to post edit HTML and add this code
<article id="default-usage">
<div class="to-lock" style="display:none;">
Hello i am the hidden content
</div>
</article>
I implemented this in my blog check demo
Since I'm using Web Application having NuGet Package's Microsoft.AspNet.Razor installed.
In WebForm pages (.aspx), I can use ResolveUrl() but in Razor pages (.cshtml), I get this error -->
"x:\Source\Foo.Dealer\Foo.Dealer.WebApp.Mobile\Member\DmsDashboard.cshtml(103): error CS0103: The name 'Url' does not exist in the current context"
Source-Code here..
#section HeadJavascriptLibraryFile
{
<script type="text/javascript" src="#Url.Content("~/scripts/webpages/setting-dmsdashboard.js")"></script>
}
and
<img src="#(Url.Content("~/images/miscellaneous/reportandpiechart2.png"))" alt="" />
Source Code as requested...
//LayoutMembmerGeneral.cshtml
#using Foo.Dealer.WebApp.Mobile.Infrastructure;
#{
if (LoginManagementTools.DealerUserLoginValidation_BrowsingPage(HttpContext.Current.Request, HttpContext.Current.Response, HttpContext.Current.Session) == false) { }
}<!DOCTYPE html>
<html>
<head>
<title>#Page.Title</title>
#RenderSection("HeadJavascriptLibraryFile", false)
</head>
<body>
#RenderBody()
</body>
</html>
//DmsDashboard.cshtml...
#using Foo.Dealer.WebApp.Mobile.Infrastructure
#using System.Web.Mvc;
#{
Page.Title = "A New Dawn In Auto Pricing";
Layout = "LayoutMemberGeneral.cshtml";
}
#section HeadJavascriptLibraryFile
{
}
<div id="WebLayout1">
<img src="#Url.Content("images/miscellaneous/reportandpiechart2.png")" alt="" />
</div>
The URL helper doesn't seem to exist in ASP.Net Web Pages (which is essentially what you are attempting to do), but you can simply use the following code to achieve the same effect:
<img src="~/images/miscellaneous/reportandpiechart2.png" alt="" />
The tilde (~) references the application root and is transformed when the page is compiled and sent to the client.
The tilde (~) is not transformed as part of any data- attributes and likely, other places also, though I haven't researched extensively.
If you happen to need this information in a place where the automatic transofmration isn't working, you can use the tilde equivalent, HttpContext.Current.Request.ApplicationPath.
In most Razor views, you should be able to shorten it to the following:
#Request.ApplicationPath
Reference: http://msdn.microsoft.com/en-us/library/system.web.httprequest.applicationpath.aspx
Another alternative in some situations is to use the VirtualPathUtility such as:
#VirtualPathUtility.ToAbsolute("~/")
I was trying to include the Google Plus One button in a Meteor app for collaborative sketching and I noticed that the script tags inside templates are not executed.
<template name="gplus">
<!-- Place this tag where you want the +1 button to render. -->
<div class="g-plusone" data-href="{{url}}"></div>
<!-- Place this tag after the last +1 button tag. -->
<script type="text/javascript">
console.log("Google Plus button");
(function() {
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script>
</template>
I got the button to work by moving the script to a separate JavaScript file, but I still wonder why the inline-script didn't work.
I see the script tag on the console, but the script itself doesn't run. How does Meteor do this?
Meteor just inserts the contents of the gplus template into the DOM, so of course nothing happens because there is no script execution when elements are added to the DOM.
To fix this you can create a .js file and put it in the client folder, which Meteor will automatically include and execute for you (as well as minify in production).
Here is what I do to load the Google +1 Button in my application:
1. Add the JS library between the <head> tag of your application.
<head>
<!-- Load JS Library -->
<script src="https://apis.google.com/js/platform.js" async="async" defer="defer"></script>
</head>
2. Insert the +1 Button.
<template name="myTemplate">
<div data-href="https://hackisition.com/" data-size="medium" class="g-plusone"></div>
</template>
3. Render the Button.
Template.myTemplate.rendered = function() {
return gapi.plusone.go();
};
I am using mediaelement.js plugin for WordPress (v2.1.7) and want to display a video with this beautifull "Backlight" style which you can see
here in action:
http://mediaelementjs.com/examples/?name=backlight
On this page there are two setup instructions which I guess is only for the non-Wordpress version:
I. Add Plugin Script
<script src="jquery.js"></script>
<script src="mediaelement-and-player.min.js"></script>
<link rel="stylesheet" href="mediaelementplayer.css" />
<!-- here's the plugin -->
<script src="mejs-feature-backlight.js"></script>
Ok to achieve this I added this script:
<script type='text/javascript' src='<?php echo bloginfo('template_url'); ?>/js/mejs-feature-backlight.js></script>
in my header.php file of my theme & copied the file "mejs-feature-backlight.js" in the folder .../wp-content/themes/themename/js .
The second instruction says the following:
II. Include the plugin in the features list
jQuery(document).ready(function($) {
// create player
$('#player1').mediaelementplayer({
// add desired features in order
features: ['playpause','current','progress','duration','volume','fullscreen','backlight'],
// the time in milliseconds between re-drawing the light
backlightTimeout: 200
});
});
I am not really sure where to copy this code-snippet. So while just guessing I copied it in the file: "mediaelement-and-player.js" which seemed to be the best choice for me in this situation.
But now when I try to post a video
which shortcode I have to use? I have tried the following:
[video src="http://mysite.com/mymedia.mp4" width="640" height="360" backlight="true"] or
[video src="http://mysite.com/mymedia.mp4" width="640" height="360" id="player1"]
But sadly it do not work. The Video plays fine but I do not see any backlight...
Any help would be greatly appreciated.
First off,
<script type='text/javascript' src='<?php echo bloginfo('template_url'); ?>/js/mejs-feature-backlight.js></script>
is wrong. It should be:
<script type='text/javascript' src='<?php bloginfo('template_directory'); ?>/js/mejs-feature-backlight.js></script>
or
<script type='text/javascript' src='<?php echo get_bloginfo('template_directory'); ?>/js/mejs-feature-backlight.js></script>
Secondly the id for the video player must match the ID in:
jQuery(document).ready(function($) {
// create player
$('#player1').mediaelementplayer({
// add desired features in order
features: ['playpause','current','progress','duration','volume','fullscreen','backlight'],
// the time in milliseconds between re-drawing the light
backlightTimeout: 200
});
});
that is "#player1". If you can dynamically generate the ID and put in the script then you are fine. Hence the location of the script should be in the same page (or php file if required) as the file that generates the video player not in an external JS file.
Hope that helps.