I have this .html (https://techstart.ro/wp-content/uploads/2022/07/index-1.html) and i want to insert it on my WordPress Post but I don't want to be as a link. And to show directly on the posting page.
Is this any solution to do it?
You could simply use an iframe to do that.
You can use Wordpress editor's HTML block and add soemthing like this:
<iframe src="https://techstart.ro/wp-content/uploads/2022/07/index-1.html"></iframe>
and add your desired width, height and other options to tag directly:
<iframe src="https://techstart.ro/wp-content/uploads/2022/07/index-1.html" height="300" width="500"></iframe>
or with css.
The other option would be using any iframe plugin and then the corresponding shortcode. such as:
iframe or advanced iframe
you can read more on it here and here.
Related
I'm trying to embed an "clickable" image (Html code with links and shapes in it) to a new style sharepoint site. As the new one doesn't feature the option to edit the source code I tried to embed it via an iframe and the embed webpart. I managed to get some html code in the iframe via the srcdoc attribute but it isn't showing my image. The image is on the Sharepoint and the link also correct.
The Code:
<iframe srcdoc="<img src=https://Testsite.com/:i:/r/sites/GBPMTest1/Shared%20Documents/Pictures/SC%20EMEA%20CoE%20Stamp%20SLENDER%20neg.png" width="400" height="400" "="" src="https://Testsite.com/:i:/r/sites/GBPMTest1/Shared%20Documents/Pictures/Weltkarte%20fertig.jpg?csf=1&web=1&e=v7OI07"></iframe>
The scr attribute is for the Sharepoint, because without it it doesn't accept the code.
Is it just not possible or did I something wrong?
What is stopping you from using the Image Web part?
Cheers
Truez
I know it has almost been 2 years but just in-case you still need the solution here it is:
The Solution:
Your img syntax is incorrect, you do not have a closing ">". Here is the proper syntax:
<iframe srcdoc="
<img src='https://Testsite.com/:i:/r/sites/GBPMTest1/Shared%20Documents/Pictures/SC%20EMEA%20CoE%20Stamp%20SLENDER%20neg.png' width='400' height='400'/>" src="https://Testsite.com/:i:/r/sites/GBPMTest1/Shared%20Documents/Pictures/Weltkarte%20fertig.jpg?csf=1&web=1&e=v7OI07" width="iframe width here" height="iframe height here"></iframe>
Don't forget to include an iframe height and width as SharePoint requires it. Also remember when embedding any html code that requires ", you need to change it to ' instead as it will break the code.
I'm writing a documentation for my codebase in Confluence and I want to add dynamically generated gitgraphs (https://gitgraphjs.com/).
Doing it with images is obviously possible, but I'd like to insert the HTML instead so that modifications can be done directly in the confluence page.
I've managed to use 'HTML Macro' to insert the HTML code, but it only renders as a tiny square inside the confluence page.
I tried fiddling around with CSS and tried to backwards-engineer the classes that Confluence was using, without success. I'm using Confluence 6.13.10
Thanks for the help
What do you use within the HTML macro? An <iframe>?
If iframe is used, then pass it some parameters:
<iframe src="https://gitgraphjs.com/..." frameborder=0 width="100%" height="1080px" scrolling="no"></iframe>
I am using django cms to create my website and a google calendar. However, when I added the code, it comes up as just plain code and won't display the calendar.
here is the link to my site:
http://138.68.6.151:8000/en/events
Can someone explain how to fix this?
I did some more research and found that I had to add the following inside my settings.py
TEXT_ADDITIONAL_TAGS = ('iframe',)
TEXT_ADDITIONAL_ATTRIBUTES = ('scrolling', 'allowfullscreen', 'frameborder',
After going to your site and using browser's console to inspect your iframe, I found that the iframe tag is improper (like a text in quotes) and therefore its not rendering properly. In your paragraph tag, the iframe tag should be in following way:
<p><iframe frameborder="0" height="500" scrolling="no" src="https://calendar.google.com/calendar/embed?height=500&wkst=1&bgcolor=%23FFFFFF&src=6uemf0u3aqg89knqb4ndic0n04%40group.calendar.google.com&color=%23853104&ctz=America%2FChicago" style="border-width:0" width="500"></iframe></p>
To verify this, after playing at front-end level I got following results.
Previous state (also notice the HTML code on the right)
After making above mentioned changes in the code at frond-end (notice on the right that now the iframe tag is highlighted as a tag which was not the case previously):
So the iframe tag is not rendering properly in your case.
Since you are using iframe in Django CMS, recipe mentioned in this stackoverflow post will assist you.
Is there a way to embed a div from another website on my own without using anything other than HTML and/or CSS? I have not really started on JS, jQuery or PHP yet so I would like to see if there is a way without it.
The div I would like to embed is:
http://imgur.com/user/BeachyBoy/favorites/#likes
You can use an iframe to insert content on your site from another domain. Not sure you can isolate just a single div though. The code to embed external content is:
<iframe src="http://addressofsite.com"></iframe>
see here for info on how to use the tag and all its available options.
You can use iframe to implement.
For example:
<iframe src="http://www.google.com" width="100%" height="4000" frameborder="0" scrolling="yes"></iframe>
If you need to import a chunk of the page, it is not possible only using HTML/CSS. it involves cross-domain issue, so jquery, ajax..are needed.
I want to make a html page that act kind like google cache.
Say in my homepage HOME, I have a link A to a website B, and when I click on A, the page that comes out will display the content of another page, with a floating bar on top that has some functions of my own choices.
For example, I want my link to show google.com, but I also want to add a button(floating bar, anything) to that google.com that allows me to return to my own webpage when pressed.
Can someone provide me some useful resources for me too look at, or even better a solution template? :)
Thanks!
You could use an <iframe> in order to display an external webpage within your webpage.
Just place the url of the webpage that you want to display inside the quotes of the src attribute.
<iframe src="http://www.webpage.com" width="400" height="400"></iframe>
An iframe sounds like it may be what you need, but I'm not 100% sure after reading your description. The iframe will show content from another URL in your page. Once you have that all you need to do is style the page and use CSS/JavaScript to add in your functionality as described.
Check out this:
http://www.w3schools.com/tags/tag_iframe.asp
Either you use an iframe or you load the site via AJAX into a div (e.g. using jQuerys load() method).
Here's the general idea:
HTML:
Click Here
<iframe id="frame" src="http://www.w3schools.com" scrolling="yes"></iframe>
Some jQuery (not tested):
$(document).ready(function() {
$('#frame').hide();
$('#link').click(function () {
$('#frame').show();
})
})
Style it as necessary
Note - this answer in no way endorses w3schools.com :-) . Please see w3fools.com/
I found Kevin Gourney's answer to be most straight forward and helpful. I'm using this to work around Adobe Spark's Domain limitation and created a simple one liner index.html file and tweaked the code as follows:
<iframe src="PasteAdobeSparkPageLinkHere" width=100% height=100%></iframe>