How to pass a field from a Wordpress plugin into an iframe - html

I have just installed Paid memberships Pro plugin and I want to pass a field into an iframe. Below is one of a number of attempts and what the subsequent source code looks like. I don't know if the issue is being caused by the fact that the PMP field also requires quotes or I am getting the syntax wrong. I have tried with quotes in the correct place (I think) see below:
<iframe src="https://www.************.com/assessment/****?email=[pmpro_member field=‘user_email']&fname=[pmpro_member field=‘first_name']&lname=[pmpro_member field=‘last_name']" style="width:100%; height:1000px;"></iframe>
I don't seem to be able to find any examples of anyone doing this (maybe you can't)?
If I put the PMP shortcode ([pmpro_member field="user_email”] directly into the HTML on a page then it picks up the correct email so I know this works. I can’t get it to pass this into the iframe though. I’m new to all this so any pointers would be appreciated.
HTML in WP page:
<iframe src='https://www.****************.com/assessment/****?email=[pmpro_member field="user_email”]' style="width:100%; height:1000px;"></iframe>
Source code:
<p><iframe src='https://www.************.com/assessment/****?email=[pmpro_member field="user_email”]' style="width:100%; height:1000px;"></iframe></p>

Hi I have managed to resolve this issue by using the 'advanced iframe pro' plugin (paid version). This allows you to take fields from the users profile and pass them into the iframe on another URL. Here is the HTML I used:
[advanced_iframe src="//www.***************.com/assessment/****?fname={usermeta-first_name}&lname={usermeta-last_name}&email={usermeta-nickname}" width="100%" height=1100px"]
This picks up the first and last name and nickname.

assuming you use it in the code, you will need to use the wp function do_shortcode
<iframe src="https://www.****************.com/assessment/****?email=<?php echo do_shortcode( '[pmpro_member field="user_email”]' ); ?>" style="width:100%; height:1000px;"></iframe>
if you use the editer you will need to enable shortcodes in iframe tag
look here for more info https://codex.wordpress.org/Function_Reference/wp_kses_allowed_html

Related

Silverstripe | Insert html shortcode - page specific

Still on my way to muster Silverstripe 3.4 I am bumping into a challenge that I cannot resolve.
A number of pages on my site must include an audio player that allows visitors to play a self-hosted track that relates specifically to the viewed page. Normally I would embed the following html to the player's engine straight into the page's code but with Silverstripe's WYSIWYG Editor that's not an option, as it rejects the inclusion of 'copied-in' code in html viewing mode.
I have not yet investigated whether it's possible to modify the editor to accept 'copied-in' code; not sure whether that could be an option too...
So, I am now looking for ways to inject code - such as the following - through my WYSIWYG in the appropriate pages:
<!-- Start of audio player body section html codes -->
<div id="AUDIOPLAYER_ID" style="display:block;position:relative;width:360px;height:auto;margin:0px auto 0px;">
<ul class="AUDIOPLAYER_CLASS" style="display:none;">
<li data-artist="TRACK_ARTIST" data-title="TRACK_TITLE" data-album="ALBUM_NAME" data-info="TRACK_INFO" data-image="TRACK_IMAGE" data-duration="TRACK_MINS">
<div class="TRACKSOURCE" data-src="SELF_HOST_TRACK_URL" data-type="audio/mpeg" />
</li>
</ul>
</div>
<!-- End of body section HTML codes -->
Note: For what it's worth, each audioplayer will have its own ID "AUDIOPLAYER_ID" to ensure pages can hold multiple players.
Can anyone share any wisdom on how to achieve this best, either through shortcodes or through a WYSIWYG intervention?
Heaps of thanks in advance!
I would implement
AudioPlayer dataobject with relations to tracks and playlist
AudioPlayerAdmin to manage AudioPlayer objects
a Page then would have a relation has_one AudioPlayer
To render the audio player object you have these options:
Page template can use $AudioPlayer variable (the relation name, that returns object), and you render the object in AudioPlayer::forTemplate()
Use a shortcode [audioplayer] in page Content field. The handler can check for current page audioplayer from Director::get_current_page()->AudioPlayer()
Use a shortcode [audioplayer,id=XXX] in page Content field. The handler can check for existing audio player by ID: AudioPlayer::get()->byID($id)
Sorry for the ridiculous delay of my response Greg but that looks helpful. Problem is: I need to upskill myself with SS's shortcodes before I can get #2 and #3 to work. I'll plow on from here mate.
Many thanks!

Change iframe contents using an external anchor?

I'm trying to make a "media hub" of sorts for the streaming team that I'm a part of. I want an iframe that loads the initial stream (for the purpose of testing, its my own, but the final would be our group channel), and when one of our usernames on the page is clicked I want it to load that specific stream into the iframe.
I've tried using this so far, but I'm fairly certain it will take more than HTML to pull off.
<div>
<iframe name="stream" src="http://www.twitch.tv/marcusraven86/embed" frameborder="0" scrolling="no" height="378" width="620"></iframe>
</div>
<ul>
<li>MarcusRaven86</li>
<li>DragonbornMonocle</li>
<ul>
The iframe is still relatively new to me, but I'm usually quick to understand with a good example. Am I at least heading in the right direction?
I was able to sold this by doing this, name the iframe, then set anchor source to the new embed link and the target to the iframe's name:
<iframe name="stream" src="http://www.twitch.tv/marcusraven86/embed"></iframe>
DragonbornMonocle
...
And so on for other streams.

Embed text files in html

I would like to display the content of a text file inside a HTML page (.rtf, .txt, .log,...) stored on the server.
I have tried with embed but seems that doesn't work.
<embed src="/path_to_text_file/text.rtf" width="500" height="300">
There is a "simple" method (or tag) to do that or I should scan for the content and print it with, for example, jQuery?
Something like this should do it:
<object data="/path_to_text_file/text.txt" type="text/plain"
width="500" style="height: 300px">
No Support?
</object>
Using a $.ajax() function with a .append() function inside you can easily grab the contents of a text document and display them on the page. Something along the lines of what you see below. Preform this on load of the page to immediately load the file in with the rest of the page.
$.ajax({
async:false,
url: 'folder/file.txt',
dataType: 'text',
success: function(data)
{
$('element').append(data);
}
});
Play around with it a little bit to get the correct result you are looking for. You could also use PHP but unless you really need to parse the data, PHP is a bit overkill in this situation.
is only for plugin content (flash, etc).
Try getting content using ajax, then write it with document.write;
Or use the include tag in a back end language (PHP, ASP, etc)
An iFrame might be useful in this context.
<iframe src="/path_to_text_file/text.rtf" width="500" height="300" frameBorder="0">
NOTE: apologies for the similarity to Keith V's answer and the fact he mentioned get requests - I only noticed his comment about get requests after posting my answer.
I find the following structure helpful, and allows me to style the text as a span rather than having to wield an object:
function append_url_content_to_div(url){
$.get(url, function(returned_data){
console.dir(returned_data);
var content = '<span>'+returned_data+'</span>';
$("#appendee_div").append(content);
});
}
append_url_content_to_div("https://dl.dropbox.com/s/euk874r7zd1cx0d/example_text.txt?dl=0"); //note that it has to be "dl." not "www." in dropbox
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="appendee_div"></div>
It works for me for dropbox content, but I don't see why it wouldn't work for publicly viewable text files. As you can see in the code, you need jquery.
I found the best way to insert HTML5 code into a website is to save the code onto a new text document and embed that document using . Then you can format the code using css and divs.
Just use php. Change the html format to php and use
echo file_get_contents("name_of_the_file.txt");
Simple as that.
You must use php because you have to output your text on the server side unless the info will not be shown to the client.
I think is the easiest way to do what you want.

app_id parameter in like button iframe code

I have a question about a parameter I see in the iframe URL when I generate the code for the like button. https://developers.facebook.com/docs/reference/plugins/like/
When I copy the iframe code, I see something like:
<iframe src="http://www.facebook.com/plugins/like.php?
app_id=1234567890&href&send=false&layout=standard&width=300&
show_faces=true&action=like&colorscheme=light&font&height=80"
scrolling="no" frameborder="0" style="border:none; overflow:hidden;
width:300px; height:80px;" allowTransparency="true"></iframe>
The meaning of all these parameters is clear to me, except "app_id".
What application is that?
I didn't specify any URL in the code, so why is Facebook giving me a new app_id?
Wasn't the app_id parameter supposed to be included in the OpenGraph tags?
Thanks in advance
Here is what I found upon investigation:
When you generate a Like button (ie, click the "get code" button), a new Facebook application is created called "Unnamed App" and tied to your developer account.
This is undocumented and new behavior. We may be seeing the result of some un-announced Facebook Platform feature/policy. Keep your eye on F8 for possible details.
what you are coping should be the xfbml version of the like button and that require javaScript SDK.
And in order to initializee JavaScript SDK, you need to register an facebook app.
app_id is part of the information of the app that u can obtained from your registered app

facebook like button won't "like"

So what's strange is that the like buttons on my site will only work IF the like button has already been liked in the past. If there are no current likes, such as on this page:
http://www.narutomeetsbleach.com/naruto-shippuden-219.html
Then you can click like all you want, but you won't actually like anything. Does anyone know what's wrong? I got my like HTML directly from facebook and it's the exact same as the like buttons that are working.
Thanks so much!
You can use the Facebook LINT tool. It actually checks you meta tags and will point you in some direction what your problem is. (Check link below.. I have added a ?v=1 to the html page to avoid facebook server error response)
http://developers.facebook.com/tools/lint/?url=http%3A%2F%2Fwww.narutomeetsbleach.com%2Fnaruto-shippuden-219.html%3Fv%3D1
Type in your url and check your page.
Try changing your code to the following (is there a reason why you are using the appId/fbAsyncInit methods?):
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="http://www.narutomeetsbleach.com/naruto-shippuden-219.html?v=2" send="false" layout="button_count" width="450" show_faces="false" font="tahoma"></fb:like>
AND / OR
Use this link to generate your LIKE BUTTON Code
http://developers.facebook.com/docs/reference/plugins/like/
Generated Like Button Code (Iframe) :
<iframe src="http://www.facebook.com/plugins/like.php?app_id=137084976372144&href=http%3A%2F%2Fwww.narutomeetsbleach.com%2Fnaruto-shippuden-219.html%3Fv%3D3&send=false&layout=standard&width=450&show_faces=false&action=like&colorscheme=light&font&height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>
Found it out! I had to remove the og:type meta tag. Found someone else on google who had a similar problem, that's what he did and now it seems to be working fine for me after I re-linted the url. Facebook's giving me a "warning" because I have og:type missing, but now it's working, so I guess that's all that matters. Thanks for all the help!
reference: Facebook "Like" produces "There was an internal error when updating the Page."
The Facebook button and all it's code comes from them and it's within an iframe with source from their server... you'll have little control over how that works. As long as you got your App ID and such entered correctly... otherwise, you're at their mercy.
Yes, even though it's just a "Like" button, you still need an App ID (appid). More detailed info below...
See the accepted answer to this: "Do I need an appid for the XFBML version of the Facebook Like button?"
And quoting this page, http://developers.facebook.com/docs/guides/web/:
"The JavaScript SDK requires that you register your website with Facebook to get an App ID (or appId). The appId is a unique identifier for your site that ensures that we have the right level of security in place between the user and your website. The following example shows how to load the JavaScript SDK once you have your appId:"