External link and attachment icons similar to Wikipedia

[P_I]

One user-friendly touch on Wikipedia is links to PDF documents display an icon at the end of the link, i.e. http://example.org/test.pdf

Source: Help:External link icons - Wikipedia

Has anyone implemented something similar in phpBB's CSS?

Would there be any takers to create a phpBB extension that provided this capability?

It might also be helpful to have the ability to set an icon to use as part of the ACP -> Posting -> Manage attachment extensions settings?

[warmweer]

It's purely ornamental ... but ...

I like the idea of having dedicated icons for different file extension.

[P_I]

Agreed it is ornamental however I find it useful as it provides a "heads-up" on whether an external link goes to a webpage or a PDF document, spreadsheet, etc.

[danieltj]

Why would you need an extension to do this when you've achieved this with CSS? I might have missed something admittedly but it looks like you got it working in your previous thread.

[warmweer]

Why would you need an extension to do this when you've achieved this with CSS? I might have missed something admittedly but it looks like you got it working in your previous thread.

You're correct in the sense that it can be done with adding/editing CSS but to me it seems like advocating custom edits.
I'ld prefer this as an extension (or perhaps as a default feature)

[P_I]

What @warmeeer said.

I have drunk the phpBB Kool-Aid on only using what's available via the Customisation Database. Hence making this an extension request.

[danieltj]

Fair enough. An extension that lets you modify the icon via the ACP would be good.

[Anișor]

You can use the CSS like they do (I know you said you would like to do this in a different way).

Code: Select all

.content a[href$=".pdf"].postlink,
.content a[href$=".PDF"].postlink {
	background: url("https://upload.wikimedia.org/wikipedia/commons/4/4d/Icon_pdf_file.png") center right no-repeat; padding-right: 18px;
}

I guess this could be used in a loop and generate the icons for each extension in the overall_header_stylesheets_after EVENT without too much hassle.
I am not sure if <style> tag is allowed for custom CSS in an extension tho.
At the end you should end up with something like:

Code: Select all

	<style>
		{% set EXTENSIONS_LIST = [
			{ ext: '.pdf', img_link: 'https://upload.wikimedia.org/wikipedia/commons/4/4d/Icon_pdf_file.png' },
			{ ext: '.docx', img_link: 'path/to/docx-icon.png' },
			{ ext: '.png', img_link: 'path/to/png-icon.png' }
		] %}

		{% for extension in EXTENSIONS_LIST %}
			.content a[href$="{{ extension.ext }}"].postlink,
			.content a[href$="{{ extension.ext|upper }}"].postlink {
				background: url("{{ extension.img_link }}") center right no-repeat; padding-right: 18px;
			}
		{% endfor %}
	</style>

Assuming the EXTENSION_LIST is queried from your list you define in the ACP.

[nou nou]

This option is pretty cool too:

https://www.canidev.com/store/cbb-attachments

[Gumboots]

Why do you need an icon to tell you that http://example.org/test.pdf links to a PDF? Or that any other link with a file suffix links to that type of file? Isn't this a total no-brainer?

[P_I]

The majority of members on my boards don't post naked links. We consider it not very user friendly. I know of a few boards that have board rules that prohibit naked links.

Many members use browser extensions to make it much easier. For example one Chrome extension that I find indispensable is Create Link. It provides a convenient way to create a hotlink to any page you may want to cite.

The extension only provides for plain text and HTML links out of the box so I added a BBCode option using this syntax: %htmlEscapedText%

[Gumboots]

I suppose so. Personally I rarely open any link without reading the url. I often want to know if the source is rubbish or not. I get the url on hover with desktop anyway, and I usually open links in a new tab on mobile, so that gives me the url on my phone.

[P_I]

We are drifting off-topic here although I do agree there is a balance to be found because out in the wild there are far too many malicious links hidden under text.

That said, we're in the Extension Requests forum and I'm hopeful someone might take up the challenge to create an extension as requested in the first post.