Embed

[grungeholic]

Embed videos from youtube and open a new window ( link{:target="_blank"} ) not working.

[Zavy86]

Can you paste a complete example please? thanks

[grungeholic]

Not parser or what?

What is the code open a new window/tab for markdown? I can't use the code [link]{: target = "_ blank"}

[Zavy86]

hi, parsedown (the library used for markdown parsing) does not support that tag at the moment. I made a request on their repository to add the function. I'm waiting for a response from them.

[georgesuba]

@grungeholic

hi, you can use something like this:

[<img src="https://upload.wikimedia.org/wikipedia/commons/b/b8/YouTube_play_button_icon_%282013%E2%80%932017%29.svg" width="250" height="250">](https://www.youtube.com/watch?v=NFILGeozt7k "Play Wiki|Docs, an Open Source Markdown Databaseless Wiki! - YouTube")

This code will produce something like this: This will display image in size 250x250 and its clickable - I use this in my markdows as loading embed from other site can slow your docs down a bit. Also this code will work anywhere where markdown is supported (forums and other platforms like github etc). Image size can be make smaller (examle: ) or bigger to any size but 250 is my preferred one as its hard to miss and displays nice on mobile 😉. Also alternate text is there and will show when you hover over the play button.

But if you really need to embed it you can use html code in markdown. Something like this:

<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="https://www.youtube.com/watch?v=NFILGeozt7k" allowfullscreen></iframe>
</div>

This will work in docuwiki. This html must be used for embeds as wiki docs are based on bootstrap. Rules are directly applied to <iframe>, <embed>, <video>, and <object> elements. This might not work everywhere as it is bootstrap specific which docuwiki uses as frontend framework. Also code can be altered to open embed in new tab.

Now if you want you can create bookmark in your browser, go to youtube, click on video and while video is playing click that bookmark and browser will give you precoded version for your wiki which you just copy with cmd+c or control+c and just paste right back into your markdwon document.

I have created few applets for markdown which allows me to link clickable images , videos, badges or links even with title etc so adding them to the docs is very fast, just press of the button. Bookmark in browser bookmarkbar is just a small java script which you can edit. If you want I can create gif or video demonstration for you, show you how it works. If you don't know how to write one of those, I can share code of my markdown applets that I've created and you can go from there. Let me know.

Note: I do not see this need it in wikidocs but if there is way to modify that edit bar I think you can add button there but since my applets works directly on video, image or page its just one press and paste on anywhere you want not just wikidocs. I would not be bothered to add this inside of wikidocs as there is no point - at least not for me and it would be waste of valuable time for @Zavy86 - I think .

[nicolas35380]

Hi,

It may help to add target=_blank ? https://github.com/Chris--A/ParsedownFilter

require('Parsedown.php');
require('ParsedownFilter.php');

$obj = new ParsedownFilter( 'myFilter' );
	
function myFilter( &$el ){

	switch( $el[ 'name' ] ){
		case 'a':

			$url = $el[ 'attributes' ][ 'href' ];
			
			/***
				If there is no protocol handler, and the link is not an open protocol address, 
				the links must be relative so we can return as there is nothing to do.
			***/
			
			if( strpos( $url, '://' ) === false )
				if( ( ( $url[ 0 ] == '/' ) && ( $url[ 1 ] != '/' ) ) || ( $url[ 0 ] != '/' ) ){ return; }
					
		
			if( strpos( $url, $_SERVER["SERVER_NAME"] ) === false ){
				$el[ 'attributes' ][ 'rel' ] = 'nofollow';
				$el[ 'attributes' ][ 'target' ] = '_blank';
			}
			break;
			
	}
}

[Zavy86]

awesome

[nicolas35380]

Using for another project, i confirm : works great !

require('parsedown/Parsedown.php');
		require('parsedown/ParsedownFilter.php');

		$Parsedown = new Parsedown();
		$FilteredParsedown = new ParsedownFilter( 'myFilter' );

		function myFilter ( &$el ) {
			switch( $el[ 'name' ] ){
				case 'h1':
					$el[ 'name' ] = 'h2';
					break;
				case 'h2':
					$el[ 'name' ] = 'h3';
					break;
				case 'h3':
					$el[ 'name' ] = 'h3';
					break;
				case 'h4':
					$el[ 'name' ] = 'h4';
					break;
				case 'h5':
					$el[ 'name' ] = 'h5';
					break;
				case 'h6':
					$el[ 'name' ] = 'strong';
					break;
				case 'img':
					$imgUrl = $el[ 'attributes' ][ 'src' ];
					if( strpos( $imgUrl, 'assets/' ) !== false ){
						$el[ 'attributes' ][ 'src' ] = "src/" . $imgUrl;
					};
					break;
			}
		}

[Zavy86]

implemented parsedown filter