Markdown Parser
Markdown is a quick and easy way to create web pages using a small number of editing symbols.
View a DEMO
Headings
For example, the # symbol is used to indicate a heading:
#Largest Heading
##Second Largest Heading
###Third Largest Heading
####Fourth Largest Heading
#####Small Heading
HTML:
Largest Heading
Second Largest Heading
Third Largest Heading
Fourth Largest Heading
Small Heading
Bullet List
To create a bullet list, use * before each item. Be sure to include a space between the * and the text.
- This is item 1
- This is item 2
- This is item 3
Bold
You can make a text item bold by enclosing it in ** ;
This is bold text
Italics
You can make a text item italic by enclosing it in a single *.
This is italic text
Block Quotes
Start paragraph with >
A double space ends the quotation
This is a quote
And this is the second line of the quote
Links
The text for the link goes inside square brackets, and the url goes inside parenthesis:
[Amazing Animals](https://wealthycats.com)
Amazing Animals
HTML:
Advanced Features
Image features are automatically added when inserting an image into text during editing
Image justification
![image description ] (image location RIGHT )
![image description ] (image location LEFT )
![image description ] (image location LEFT SMALL )
Image sizes
XSMALL: 100px SMALL: 180px MEDUIM: 300px LARGE: 450px XLARGE: 700pxImage with Caption
![image description](image location)%%This is a caption/%%Style
[STYLE](class name)Text to be styled [ENDSTYLE]Color
[COLOR](Color code or name)Text to be colored[ENDCOLOR]Break from left or right float
[BREAK]Blank line
[BLANKLINE] [BLANKLINES](number of blank lines)Columns
2 Columns: [2COL1]Text[2COL2]Text [ENDCOL]3 Columns: [3COL1]Text[3COL2]Text[3COL3]Text[ENDCOL]
2/3 Columns: [23COL1]Text[3COL3] Text [ENDCOL] [3COL1]Text[23COL2] Text [ENDCOL]
<div class = 'dropdownwrap'>
<button class = 'dropdownbutton' id = 'css' onclick= 'accordionToggle(this.id)'>Sample CSS File ▾</button>
<div id ='css-content' class = 'dropdowncontent1' style = 'display: none; ' >
<?php
$string = file_get_contents ('data/sample-style.txt');
echo nl2br ($string);
?>
</div>
</div>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>'Convert Markdown to HTML Demo'</title>
<link rel= 'stylesheet' type='text/css' href= 'style.css'>
</head>
<body>
<div class = 'header'>
<a class = 'return' href = 'index.php'>← Return</a>
</div>
<main>
<?php
include ("markdown/convert-markdown.php");
if ($_SERVER ["REQUEST_METHOD"] == "POST" ) {
if (isset ($_POST['text'])) {
$text = $_POST['text'];
}
if (isset ($_POST['textid'])) {
$textid = $_POST['textid'];
}
//Display html document
if (strlen ($text) > 2000) {
echo "</div class = 'error'>Text must be less than 2000 characters</div>";
}
else {
$textid = 'home';
$htmltext = convertMD ($text, $textid);
echo $htmltext;
}
?>
<div class = 'dropdownwrap'>
<div class = 'dropdownbutton' id = 'html' onclick= 'accordionToggle(this.id)'>View HTML ▾</div>
<div id ='html-content' class = 'dropdowncontent1' style = 'display: none; ' >
<?php
$codeblock = htmlentities ($htmltext);
$codeblock = str_replace (">", ">\n", $codeblock);
echo "<div class = 'html-section'>";
echo nl2br ($codeblock);
echo "</div></div></div>";
}
?>
</main>
<br><br><br><br>
<script>
function accordionToggle(bttn) {
///Used tp display sections in Control Panel
var x = document.getElementById(bttn+"-content");
if (x.style.display === "block" ) {
x.style.display = 'none';
}
else {
x.style.display = 'block';
}
}
</script>
</body>
</html>
<?php
//Copyright (c) 2021, Susan V. Rodgers, Lila Avenue, LLC, lilaavenue@gmail.com
include ("markdown/convert-markdown.php");
$text = file_get_contents ("data/sample-text.txt");
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Convert Markdown to HTML Demo</title>
<link rel= 'stylesheet' type='text/css' href= 'style.css'>
</head>
<body>
<header>
<a class = 'return' href = '../../markdown-parser'>← Return </a>
<h2>Convert Markdown to HTML</h2>
</header>
<main class = 'home'>
<form method='post' action='html-page.php'>
<h2>Sample Text</h2>
You can delete this and type in your own
<textarea id = 'text-id' name = 'text' rows = '10' cols = '100'><?php echo $text ;?></textarea>
<br><input class = 'submitbutton' type = 'submit' name = 'submit' value='Convert to HTML'/>
</form>
<?php
include ("markdown/markdown-instructions.php");
include ('display-sample-style.php');
?>
</main>
<footer>
<br><br><br>Copyright © <?php echo date('Y'); ?> Susan Rodgers, <a href = 'https://lilaavenue.com'>Lila Avenue</a><br><br>
</footer>
<script>
function accordionToggle(bttn) {
///Used tp display sections in Control Panel
var x = document.getElementById(bttn+"-content");
if (x.style.display === "block" ) {
x.style.display = 'none';
}
else {
x.style.display = 'block';
}
}
</script>
</body>
</html>
body {
font-family: "Arial", sans-serif;
text-align: center;
font-size: 1em;
margin: 0 auto;
}
h1, h3 {
text-align: center;
}
a {
text-decoration: none;
color: lightcoral;
}
a:hover {
color: aqua;
}
header, footer {
text-align: center;
display: block;
padding: 20px 0;
width: 100%;
color: white;
background-color: #434460;
}
main {
text-align: left;
display: block;
margin: auto;
background-color: white;
width: 1300px;
max-width: 100%;
padding: 20px;
box-sizing: border-box;
}
input.submitbutton {
width: 140px;
border: 1px solid #bbb;
border-radius: 5px;
padding: 10px;
margin: 5px auto;
color: white;
background-color: darkmagenta;
}
textarea {
font-family: "Lato", sans-serif;
padding: 20px;
border: 1px solid #ddd;
width: 100%;
max-width: 100%;
color: #444;
margin: 20px 0;
background-color: #e8e8e8;
}
blockquote {
border: 1px solid #bbb;
padding: 10px;
background-color: pink;
}
.markdown-instructions {
font-size: 14px;
color: #666;
}
.html-section {
padding: 20px;
background-color: pink;
}
.half-column-1, .half-column-2, .full-column, .third-column-1, .third-column-2, .third-column-3, .two-thirds-column-1, .two-thirds-column-2 {
margin-top: 30px;
display: inline-block;
box-sizing: border-box;
background-color: white;
line-height: 170%;
vertical-align: top;
margin: 5px 0;
padding: 10px;
max-width: 100%;
}
.half-column-1, .half-column-2 {
width: 45%;
margin: 5px;
}
.third-column-1, .third-column-2, .third-column-3 {
width: 33%;
}
.two-thirds-column-1, .two-thirds-column-2 {
width: 66%;
}
.greybackground {
background-color: #eee;
padding: 20px;
}
img {
max-width: 95%;
margin: auto;
display: block;
width: 400px;
}
figure img {
padding: 0;
}
figure {
padding: 20px;
}
.image-center {
margin: 0 auto;
float: none;
}
.image-right {
float: right;
margin: 0;
}
.image-left {
float: left;
margin: 0;
}
.image-xsmall {
max-width: 140px;
}
.image-small {
max-width: 240px;
}
.image-medium {
max-width: 400px;
}
.image-large {
max-width: 600px;
}
.image-xlarge {
width: 700px;
}
.pink {
color: pink;
}
.green {
color: green;
}
/** BREAKPOINTS */
@media only screen and (max-width: 750px) {
.half-column-1, .half-column-2, .full-column, .third-column-1, .third-column-2, .third-column-3, .two-thirds-column-1, .two-thirds-column-2 {
width: 100%;
margin: 0;
}
main {
padding: 0;
}
.image-right, .image-left {
float: none;
}
}
markdown
<?php
if (strpos ($newstring, "[BLANKLINES](") !== false){
$array1 = explode ("[BLANKLINES](", $newstring);
$newstring1 = "";
foreach ($array1 as $id => $item) {
$item = trim ($item);
if ($id === 0 && substr ($newstring, 0, 13) !== '[BLANKLINES](') {
$newstring1 = $item;
}
else {
$pos2 = strpos ($item, ")");
$count = substr ($item, 0, $pos2);
$numcount = intval ($count);
$remaining = substr ($item, $pos2 + 1) ;
$lines = "";
for ($l = 0; $l < $numcount; $l++) {
$lines .= " [BLANKLINE] ";
}
$newitem = $lines . $remaining;
$newstring1 .= $newitem;
}
}
$newstring = $newstring1;
}
?>
<?php
$newstring1 = "";
if (strpos ($newstring, "[COLOR](" ) !== false) {
$array1 = explode ("[COLOR](", $newstring);
foreach ($array1 as $id => $item) {
$item = trim ($item);
if ($id === 0 ) {
//beginning of string
$newstring1 .= $item;
}
else {
$pos2 = strpos ($item, ")");
$color = substr ($item, 0, $pos2);
$remaining = substr ($item, $pos2 + 1);
$newitem = "<span style = 'color: " . $color . ";'>" . $remaining;
$newstring1 .= $newitem;
}
}
$newstring = $newstring1;
$newstring = str_replace ("[ENDCOLOR]", "</span>", $newstring);
}
?>
<?php
//Start new line after image
$newstring = str_replace ("[BREAK]", "<div style = 'clear: both; float: none;'></div><br>", $newstring);
// Columns
$newstring = str_replace ("[2COL2]", "</div><div class = 'half-column-2'><br>", $newstring);
$newstring = str_replace ("[2COL1]", "<div class = 'half-column-1'><br>", $newstring);
$newstring = str_replace ("[23COL1]", "<div class = 'two-thirds-column-1'><br>", $newstring);
$newstring = str_replace ("[23COL2]", "</div><div class = 'two-thirds-column-2'><br>", $newstring);
$newstring = str_replace ("[3COL3]", "</div><div class = 'third-column-3'><br>", $newstring);
$newstring = str_replace ("[3COL2]", "</div><div class = 'third-column-2'><br>", $newstring);
$newstring = str_replace ("[3COL1]", "<div class = 'third-column-1'><br>", $newstring);
$newstring = str_replace ("[ENDCOL]", "</div><br>", $newstring);
?>
<?php
$newarray = array();
$array = explode ("<br>", $newstring);
foreach ($array as $id => $item) {
$item = trim ($item);
if (substr ($item, 0, 5) === "#####"){
$array[$id] = "<h5>" . substr($item, 5) . "</h5>";
}
else if (substr ($item, 0, 4) === "####"){
$array[$id] = "<h4>" . substr($item, 4) . "</h4>";
}
else if (substr ($item, 0, 3) === "###") {
$array[$id] = "<h3>" . substr($item, 3) . "</h3>";
}
else if (substr ($item, 0, 2) === "##") {
$array[$id] = "<h2>" . substr($item, 2) . "</h2>";
}
else if (substr ($item, 0, 1) === "#" ) {
$array[$id] = "<h1>" . substr($item, 1) . "</h1>";
}
}
$newstring = implode ("<br>", $array);
?>
<?php
$newstring = trim ($newstring);
$newstring1 = "";
if (strpos ($newstring, "[![") !== false) {
$array1 = explode ("[![", $newstring);
foreach ($array1 as $id => $item) {
$item = trim ($item);
$newitem = '';
if ($id === 0 && substr ($newstring, 0, 3) !== '[![') {
//beginning of string before any matches
$newitem = $item;
}
else {
$imagedata = $linkaddress = $name = "";
$pos1 = 0;
$pos2 = strpos ($item, "]");
//name
$name = substr ($item, 0, $pos2);
$name = htmlspecialchars ($name);
//image location including size and justification
$pos3 = strpos ($item, "(");
$pos4 = strpos ($item, ")");
$imagedata = substr ($item, $pos3 + 1, $pos4-$pos3 -1);
//closing ']'
$pos5 = $pos4 + 1;
//opening '(' for start of link address
$pos6 = $pos4 + 2;
//find closing ')' for end of link address
$remaining = substr ($item, $pos6);
$pos7 = strpos ($remaining, ')');
$linkaddress = substr ($remaining, 1, $pos7 - 1);
//rest of the characters in item after end of link
$remainingafterlink = substr ($remaining, $pos7 + 1 );
//Determine width of image
$size = "";
if (strpos($imagedata, "XSMALL")) {
$size = 'image-xsmall';
$imagedata = str_replace ("XSMALL", "", $imagedata);
}
if (strpos($imagedata, "SMALL")) {
$size = 'image-small';
$imagedata = str_replace ("SMALL", "", $imagedata);
}
else if (strpos ($imagedata, "MEDIUM")) {
$size = 'image-medium';
$imagedata = str_replace ("MEDIUM", "", $imagedata);
}
else if (strpos ($imagedata, "XLARGE") ) {
$size = 'image-xlarge';
$imagedata = str_replace ("XLARGE", "", $imagedata);
}
else if (strpos ($imagedata, "LARGE") ) {
$size = 'image-large';
$imagedata = str_replace ("LARGE", "", $imagedata);
}
//Determine image justification
$justify = "";
if (strpos ($imagedata, "RIGHT") ) {
$justify = 'image-right';
$imagedata = str_replace ('RIGHT', "", $imagedata);
}
else if (strpos ($imagedata, "CENTER")) {
$justify = 'centered';
$imagedata = str_replace ('CENTER', "", $imagedata);
}
else if (strpos ($imagedata, "LEFT")) {
$justify = 'image-left';
$imagedata = str_replace ('LEFT', "", $imagedata);
}
else if (strpos ($imagedata, "GRID")) {
$justify = 'imagegridcolumn';
$imagedata = str_replace ('GRID', "", $imagedata);
}
//build html for this image link
$newitem .= "<a href = '" . $linkaddress . "'>";
$newitem .= "<img src = '" . $imagedata . " ' alt = '" . $name . "' class = '" . $justify . " " . $size . "' /></a>";
$newitem .= $remainingafterlink;
}
$newstring1 .= $newitem;
}
//final converted string
$newstring = $newstring1;
}
?>
<?php
$newstring1 = "";
$imagecount = 0;
$newstring = trim ($newstring);
if (strpos ($newstring, "![") !== false) {
$array1 = explode ("![", $newstring);
foreach ($array1 as $id => $item) {
$item = trim ($item);
$newitem = '';
if ($id === 0 && substr ($item, 0, 2) !== '![') {
//beginning of string before image
$newitem = $item;
}
else {
$imagedata = $name = "";
$pos1 = 0;
$pos2 = strpos ($item, "]");
//name
$name = substr ($item, 0, $pos2);
$name = htmlspecialchars ($name);
//image location including size and justification
$pos3 = strpos ($item, "(");
$pos4 = strpos ($item, ")");
$imagedata = substr ($item, $pos3 + 1, $pos4-$pos3 -1);
$remaining = substr ($item, $pos4 + 1 );
//Assign a number to this image
$imagenumber = 'img-' . $imagecount;
$imagecount++;
//Determine width of image
$size = "";
if (strpos($imagedata, "XSMALL")) {
$size = 'image-xsmall';
$imagedata = str_replace ("XSMALL", "", $imagedata);
}
else if (strpos ($imagedata, "SMALL") ) {
$size = 'image-small';
$imagedata = str_replace ("SMALL", "", $imagedata);
}
else if (strpos ($imagedata, "MEDIUM")) {
$size = 'image-medium';
$imagedata = str_replace ("MEDIUM", "", $imagedata);
}
else if (strpos ($imagedata, "XLARGE") ) {
$size = 'image-xlarge';
$imagedata = str_replace ("XLARGE", "", $imagedata);
}
else if (strpos ($imagedata, "LARGE") ) {
$size = 'image-large';
$imagedata = str_replace ("LARGE", "", $imagedata);
}
//Determine image justification
$justify = "";
if (strpos ($imagedata, "RIGHT") ) {
$justify = 'image-right';
$imagedata = str_replace ('RIGHT', "", $imagedata);
}
else if (strpos ($imagedata, "LEFT")) {
$justify = 'image-left';
$imagedata = str_replace ('LEFT', "", $imagedata);
}
else if (strpos ($imagedata, "CENTER")) {
$justify = 'centered';
$imagedata = str_replace ('CENTER', "", $imagedata);
}
else if (strpos ($imagedata, "GRID")) {
$justify = 'imagegridcolumn';
$imagedata = str_replace ('GRID', "", $imagedata);
}
$caption = "";
$pos5 = strpos ($item, '%%');
$pos6 = strpos ($item, '/%%');
if ($pos5 && $pos6 ) {
$captionlength = $pos6 - $pos5 - 2;
$caption = substr ($item, $pos5 + 2, $captionlength);
$remaining = substr ($item, $pos6 + 3);
$newitem .= "<figure class = '" . $justify . " " . $size . "' >";
$newitem .= "<img src = '" . $imagedata . " ' alt = '" . $name . "' />";
$newitem .= "<figcaption>" . $caption . "</figcaption>";
$newitem .= "</figure>";
}
else {
//if no link selected, add link to single-image-page
$folderfile = str_replace ('data/images/', '', $imagedata);
$folderfile = trim ($folderfile);
$newitem .= "<a href = 'image/" . $folderfile . "/home'><img src = '" . $imagedata . "' alt = '" . $name . "' class = '" . $imagenumber . " ". $justify . " " . $size . "' /></a>";
}
$newitem .= $remaining;
}
$newstring1 .= $newitem;
}
$newstring = $newstring1;
}
?>
<?php
//Convert bold and italic at at start of line
if (strpos ($newstring, "***", 0) !== false) {
$tag = 0;
$newstring1 = "";
$array1 = explode ("***", $newstring);
foreach ($array1 as $item) {
if ($tag === 0) {
$newstring1 .= $item;
$tag = 1;
//echo "<br><br>" . htmlentities ($newstring1);
}
else {
$newstring1 .= "<b><i>" . $item . "</i></b>" ;
$tag = 0;
}
}
$newstring = $newstring1;
//echo "<br>" . htmlentities ($newstring);
}
if (strpos ($newstring, "**", 0) !== false) {
$tag = 0;
$newstring1 = "";
$array2 = explode ("**", $newstring);
foreach ($array2 as $item) {
if ($tag === 0) {
$newstring1 .= $item;
$tag = 1;
//echo "<br><br>" . htmlentities ($newstring1);
}
else {
$newstring1 .= "<b>" . $item . "</b>" ;
$tag = 0;
}
}
$newstring = $newstring1;
// echo "<br>" . htmlentities ($newstring);
}
if (strpos ($newstring, "*", 0) !== false) {
$newstring1 = "";
$tag = 0;
$array1 = explode ("*", $newstring);
foreach ($array1 as $item) {
if ($tag === 0) {
$newstring1 .= $item;
$tag = 1;
//echo "<br><br>" . htmlentities ($newstring1);
}
else {
$newstring1 .= "<i>" . $item . "</i>" ;
$tag = 0;
}
}
$newstring = $newstring1;
// echo "<br>" . htmlentities ($newstring);
}
?>
<?php
if (strpos ($newstring, "[") !== false) {
$newstring1 = "";
$array1 = explode("[", $newstring);
foreach ($array1 as $id => $item) {
if ($id === 0 && substr ($newstring, 0, 1) !== '[') {
$newitem = $item;
}
else {
$linkfield = "";
$pos1 = 0;
$pos2 = strpos ($item, "]");
$pos3 = strpos ($item, "(");
$pos4 = strpos ($item, ")");
$namelength = $pos2;
$hreflength = $pos4 - $pos3;
$name = substr ($item, 0 , $namelength);
$href = substr ($item, $pos3+1, $hreflength -1);
$linkfield = "<a href = '" . $href . "'>" . $name . "</a>";
$newitem = $linkfield . substr ($item, $pos4+1);
}
$newstring1 .= $newitem;
}
$newstring = $newstring1;
}
?>
<?php
//remove extra br tags at beginning and end
$array1 = explode ("<br>", $newstring);
$newarray = array();;
$breakcount = 0;
$paragraph = false;
$quote = false;
foreach ($array1 as $id => $item) {
$item = trim ($item);
if (substr ($item, 0, 10) === "STARTQUOTE") {
if ($paragraph) {
array_push ( $newarray, '</p>');
$paragraph = false;
}
$quote = true;
array_push ($newarray, "<blockquote>" . $item );
}
//A non-inline tag has been detected -
else if (substr ($item, 0, 1) === '<' &&
substr ($item, 0, 3) !== "<i>" &&
substr ($item, 0, 3) !== "<b>" &&
substr ($item, 0, 5) !== "<span" &&
substr ($item, 0, 3) !== "<a>") {
if ($paragraph ) {
array_push ($newarray, "</p>" . $item);
$paragraph = false;
}
else if ($quote) {
array_push ($newarray, "</blockquote>" . $item);
$quote = false;
}
else {
array_push ($newarray, $item );
}
}
//Item contains text
else if ($item !== "" ) {
if ($paragraph === false && $quote === false) {
//for an image or image link, just save item
if ( strpos ($item, '![')) {
array_push ($newarray, $item);
}
else if ($quote === false) {
//Open paragraph
array_push ($newarray, "<p>" . $item);
$paragraph = true;
}
}
else {
//paragraph or quote already open, insert a blank line
array_push ($newarray, "[BLANKLINE]" . $item);
}
}
else {
//This is a blank line
$breakcount ++;
if ($breakcount > 0) {
//2 blank lines indicate a paragraph has ended
if ($paragraph) {
array_push ($newarray , "</p>");
$paragraph = false;
$breakcount = 0;
}
else if ($quote) {
array_push ($newarray , "</blockquote>");
$quote = false;
$breakcount = 0;
}
}
}
}
if ($paragraph) {
array_push ($newarray, "</p>");
}
if ($quote) {
array_push ($newarray, '</blockquote>');
}
//print_r ($newarray);
$newstring = implode ("<br>", $newarray);
?>
<?php
echo $newstring;
//remove extra br tags at beginning and end
$array1 = explode ("<br>", $newstring);
$newarray = array();;
$breakcount = 0;
$quote = false;
foreach ($array1 as $id => $item) {
$item = trim ($item);
if (substr ($item, 0, 10) === "STARTQUOTE") {
$quote = true;
array_push ($newarray, "</blockquote>" . $item);
}
//Ignore all non-paragraph items
else if (substr ($item, 0, 1) === '<' &&
substr ($item, 0, 3) !== "<i>" &&
substr ($item, 0, 3) !== "<b>" &&
substr ($item, 0, 5) !== "<span" &&
substr ($item, 0, 3) !== "<a>") {
if ($quote) {
array_push ($newarray, "</blockquote>" . $item);
$quote= false;
}
else {
array_push ($newarray, $item );
}
}
else if ($item !== '') {
array_push ($newarray, $item );
}
else {
//This is a blank line
$breakcount ++;
if ($breakcount > 0) {
//2 blank lines indicate a paragraph has ended
if ($quote) {
array_push ($newarray , "</blockquote>");
$quote = false;
$breakcount = 0;
}
$quote = false;
}
}
}
if ($quote) {
array_push ($newarray, "</blockquote>");
}
//print_r ($newarray);
$newstring = implode ("<br>", $newarray);
?>
<?php
$newstring1 = "";
if (strpos ($newstring, "[STYLE](" ) !== false) {
$array1 = explode ("[STYLE](", $newstring);
foreach ($array1 as $id => $item) {
$item = trim ($item);
if ($id === 0 ) {
//beginning of string
$newstring1 .= $item;
}
else {
$pos2 = strpos ($item, ")");
$style = substr ($item, 0, $pos2);
$remaining = substr ($item, $pos2 + 1);
$newitem = "<div class = '" . $style . "'>" . $remaining;
$newstring1 .= $newitem;
}
}
$newstring = $newstring1;
$newstring = str_replace ("[ENDSTYLE]", "</div>", $newstring);
}
?>
<?php
$newstring1 = "";
$open = false;
$array1 = explode ("<br>", $newstring);
foreach ($array1 as $id => $item) {
$item = trim ($item);
if (substr ($item, 0, 2) === "- " || substr ($item, 0, 2) === "* " ) {
//List item
if ($open === false) {
//first list item
$newstring1 .= "<br><ul>";
$open = true;
}
//Markdown character starts the line
$newstring1 .= "<li>" . substr ($item, 2) . "</li>";
}
//not list item
else if ($open === true) {
$newstring1 .= "</ul><br>" . $item;
$open = false;
}
else {
$newstring1 .= $item . "<br>";
}
}
if ($open === true) {
$newstring1 .= "</ul><br>";
$open = false;
}
$newstring = $newstring1 ;
?>
<?php
//Copyright (c) 2022, Susan V. Rodgers, Lila Avenue, LLC, https://lilaavenue@gmail.com
function convertMD ($text, $textid) {
$text = trim ($text);
$newstring = str_replace ("\n", "<br>", $text);
$newstring = str_replace ("\>", "ESCAPEDTAG", $newstring);
$newstring = str_replace ("\#", "ESCAPEDHASH", $newstring);
$newstring = str_replace (' >', 'STARTQUOTE', $newstring);
$newstring = str_replace ('\*', 'ESCAPEDASTERIX', $newstring);
$newstring = str_replace ('\-', 'ESCAPEDDASH', $newstring);
$newstring = str_replace ('\[', 'ESCAPEDSQUARE', $newstring);
require ("markdown/convert-markdown-headers.php");
require ("markdown/convert-markdown-divs.php");
require ("markdown/convert-markdown-styles.php");
require ("markdown/convert-markdown-ul.php");
require ("markdown/convert-markdown-inline.php");
require ("markdown/convert-markdown-image-links.php");
require ("markdown/convert-markdown-images.php");
require ("markdown/convert-markdown-blanklines.php");
//require ("markdown/convert-markdown-quotes.php");
require ("markdown/convert-markdown-paragraphs.php");
require ("markdown/convert-markdown-colors.php");
$newstring = str_replace ("<br>", "", $newstring);
$newstring = str_replace ("[BLANKLINE]", "<br>", $newstring);
require ("markdown/convert-markdown-links.php");
$newstring = str_replace ("ESCAPEDASH", "-", $newstring);
$newstring = str_replace ("ESCAPEDTAG", '>', $newstring);
$newstring = str_replace ("ESCAPEDHASH", '#', $newstring);
$newstring = str_replace ("STARTQUOTE", '', $newstring);
$newstring = str_replace ("ESCAPEDASTERIX", "*", $newstring);
$newstring = str_replace ("ESCAPEDDASH", '-', $newstring);
$newstring = str_replace ("ESCAPEDSQUARE", '[', $newstring);
require ("markdown/validate-HTML.php");
return $newstring;
}
?>
<div class = 'dropdownwrap'>
<button class = 'dropdownbutton' id = 'editing' onclick= 'accordionToggle(this.id)'>Markdown Editor Instructions ▾</button>
<div id ='editing-content' class = 'dropdowncontent1' style = 'display: none; ' >
<div class = 'markdown-instructions'>
<div class = 'half-column-1'>
<h2>Standard Markdown Syntax</h2>
<b>#</b> Heading1 <br>
<b>##</b> Heading2 <br>
<b>###</b> Heading3 <br>
<b>####</b> Heading4 <br>
<b>#####</b> Heading5 <br>
<br>*<i>Italics</i>*
<br>**<b>Bold</b>**
<br> ***<i><b>Bold Italics</b></i>***
<br><br>
<b>Bullet List</b><br>
* item (single asterisk followed by a space)
<br><br>
<b>Bullet List</b><br>
- item (single dash followed by a space)
<br><br>
Note: To show an asterisk or dash in the text, use '\*' or '\-'<br><br>
<b>Images:</b>
<br> ![image description ] (image location )
<br><br>
<b>Link</b>
<br>[link name] (link url)
<br><br>
<b>Image Link</b><br>
[![image description](image location)](link url )
<br><br>
</div><div class = 'half-column-2'>
<h2>Shortcodes</h2>
<b>Image sizes and justification</b>
<br> ![image description ] (image location RIGHT )<b></b>
<br> ![image description ] (image location LEFT )<b></b>
<br> ![image description ] (image location LEFT SMALL )<b></b>
<br><br>
<b>Image sizes:</b><br>
XSMALL: 100px, SMALL: 180px, MEDUIM: 300px, LARGE: 450px, XLARGE: 700px
<br><br>
<b>Image with Caption:</b>
<br> ![image description](image location)%%This is a caption/%%
<br><br>
<b>Quote</b>
<br>[QUOTE]Quoted text[ENDQUOTE]
<br><br>
<b>Style</b>
<br>[STYLE](class name)Text to be styled [ENDSTYLE]
<br><br>
<b>Color</b>
<br>[COLOR](Color code or name)Text to be colored[ENDCOLOR]
<br><br>
<b>Break from left or right float</b>
<br>[BREAK]
<br><br>
<b>Single blank line</b>
<br>[BLANKLINE]
<br><br>
<b>Multiple blank lines</b>
<br>[BLANKLINES](number of blank lines)
<br><br>
<b>2 Columns: </b><br>
[2COL1]Text[2COL2]Text [ENDCOL]
<br><br>
<b>3 Columns:</b><br>
[3COL1]Text[3COL2]Text[3COL3]Text[ENDCOL]
<br><br>
<b>2/3 Columns:</b><br>
[23COL1]Text[3COL3] Text [ENDCOL]<br>
[3COL1]Text[23COL2] Text [ENDCOL]
</div>
</div>
</div>
</div>
<?php
$error = false;
$openbracketcount = substr_count($newstring,"<", 0);
$closingbracketcount = substr_count ($newstring, ">", 0);
//Checi for scripts
$tagarray = array();
$voidtags = array ("img", "br", "input", "hr", "col");
$tag = "";
$array1 = explode ("<", $newstring);
foreach ($array1 as $item) {
$item = trim($item);
//echo "<br>" . $item;
if ($item !== "") {
//Retrieve tag from string
$pos1 = strpos ($item, ">");
$tag = substr ($item, 0, $pos1);
$pos2 = strpos ($item, " ");
if ($pos2 !== false) {
$tag = substr ($tag, 0, $pos2);
}
if (! in_array ($tag, $voidtags)) {
array_push ($tagarray, $tag);
}
}
}
$opentagarray = array();
$previd = 0;
// print_r ($tagarray);
foreach ($tagarray as $item2) {
$item2 = trim ($item2);
if (strpos ($item2, "/") === false) {
array_push ($opentagarray, $item2);
//echo "<br>OPEN:" . $item2;
}
else {
$tag = str_replace ("/", "", $item2);
if ($tag === end($opentagarray)) {
// echo "<br>END: " . $item2;
array_pop ($opentagarray);
}
else {
//echo "TAG: " .$tag ;
$error = true;
}
}
}
if (count ($opentagarray) > 0) {
$error = true;
}
if ($error === true ) {
echo "<div style = 'background-color: white; color: red; padding: 20px; font-size: 18px;'>Invalid Syntax </div>";
}
?>
<div class = 'dropdownwrap'>
<button class = 'dropdownbutton' id = 'html' onclick= 'accordionToggle(this.id)'>View HTML ▾</button>
<div id ='html-content' class = 'dropdowncontent1' style = 'display: none; ' >
<div class = 'view-html'>
<?php
if ($pageid === 'add-update-block') {
$htmlcontent = $blockrecord['html-content'];
}
else if ($pageid === 'add-update-post') {
$htmlcontent = $postrecord['html-content'];
}
$codeblock = htmlentities ($htmlcontent);
$codeblock = str_replace (">", ">\n", $codeblock);
echo nl2br ($codeblock);
?>
</div>
</div>
</div>