Correct img tag - tags

I'd like to ask you which img tag is right:
<img src="http://i.imgur.com/r5wwImhb.jpg">
or
<img src="http://i.imgur.com/r5wwImhb.jpg"/>
Thank you.

It depends on if you are using HTML or XHTML. The first one is correct in HTML and the second one in XHTML.

According to the first search result for <img> tag on w3schools:
In HTML the <img> tag has no end tag.
In XHTML the <img> tag must be properly closed.

Related

TYPO3 Image From Extension

I'm a typo newbie, and was wondering, how I can make the following code work in my HTML Template file:
<img src="EXT:extension-name/Resources/Public/Images/Logo/logo-white.png" alt="logo.png">
Looking forward to your anwers, thanks.
This cannot be done in an HTML file but within a Fluid template file you should use the uri.resource viewhelper:
<img src="{f:uri.resource(path: 'Images/Logo/logo-white.png')}" alt="Actual explanation of the logo content">
If used within an Extbase plugin there is nothing else to do.
For templates using the FLUIDTEMPLATE content object you'll need to set the extension name, for example with an extensionName: 'MyExt' as argument:
<img src="{f:uri.resource(path: 'Images/Logo/logo-white.png', extensionName: 'MyExt')}" alt="Actual explanation of the logo content">
Alternatively use controllerExtensionName in your TypoScript setup.

Unable to create an image hyperlink with xhtml2pdf

Consider the following code:
from xhtml2pdf import pisa
if __name__=="__main__":
source_HTML = """<html>
<body>
<a href="http://www.stackoverflow.com">
<img src="http://i.stack.imgur.com/uQFNA.png"/>
</a>
<a href="http://www.stackoverflow.com">
<p>Stackoverflow</p>
</a>
</body>
</html>"""
output_filename = "output.pdf"
# open output file for writing (truncated binary)
result_file = open(output_filename, "w+b")
# convert HTML to PDF
pisa.CreatePDF(
source_HTML,
dest=result_file)
result_file.close()
The html should render both an hyperlink image and a hyperlink text, but xhtml2pdf renders the image without the hyperlink and the text with the hyperlink. Is this an issue with the code above or a limitation/bug with the library? Thanks in advance for any help with the above issue.
I found a way to get this too work but it is not very good.
You can add a before and after the img inside the A tag. And then set the font-size on the A tag to be the height of the image and then also set text-decoration to none.
So like I said this works but is not a great solution. I searched issues on xhtml2pdf's github page and cannot find anyone else with this issue.

Ignore a certain tag in TinyMCE

I'm using TinyMCE editor in my project and I would like to make it ignore the tag <--image-->.
Now, if I write this tag, it replaces it with <p> </p>
Is it possible to do this?
Yes, you will have to add this tag to your valid tinymce tags.
Have acloser look at the tinymce paramter valid_elements and valid_children.

How can I enable tinyMCE in Umbraco to add a div with a class attribute and contain a paragraph?

I need to allow add a div with a class attribute in tinyMCE in Umbraco. I can add a div, but all content in the div is just text. I need that text has a paragraph, and finally add a class attribute for the div.
It's a little hard to understand what you are asking, but I think this should help.
http://our.umbraco.org/wiki/recommendations/recommended-reading-for-content-editors/adding-styles-to-the-tinymce
You can basically associate a stylesheet with the tinyMCE and then add styles to it that will appear in the style dropdown
You may use
tinymce.activeEditor.execCommand('insertHTML', false, '<div class="section'></div>');
This will insert the specified html into the editor at the local caret position.
Be aware that your valid_elements and valid_children configuration settings won't strip out anything from the html that you insert.
If you can paste your template code then we can be more of a help to you.
What you want to do is wrap your <umbraco:Item field="aliasOfYourRTE" runat="server" />
with the div you want so in your case your code will look like this:
<div class="YOURCLASSNAMEHERE">
<umbraco:Item field="bodyText" runat="server" />
</div>
The umbraco RTE automatically spits out <p> </p> tags when content is inserted. Also, make sure you are publishing your node so that your content is viewable on the front end.
Hope this helps.
Go to Settings - Styles.
Open the stylesheet with the styles for the Format dropdown of TinyMCE in Data Type Richtexteditor.
Add a style with the Alias div.class, e.g. div.alert alert-danger.
If you then click in TinyMCE on a paragraph and then choose in the Format dropdown this style the paragraph is formatted as follows:
<div class="alert alert-danger"> ... </div>
Is this what you wished to do?

<embed> instead <img> tag HTML

I want to make a function that allows me to display an image or a swf, I noticed that the embed tag I can show both, I lnvestigated and got nothing about it, there is some downside in using it?
example:
<embed src="image.png" />
<embed src="flash.swf" />
Both work even without including the type.
You really should use the <img> tag for images and not <embed>. Instead, figure out what the file type is first and then use either <img> OR <embed> depending on the file type.
Yes, but, however, <embed> tag isn't recommended to be used.