Website 2 - Add Text Editing

The following example is an upgrade to the previous example.

Now, the user can login to an administrative screen and make updates using markdown syntax. Since the markdown parser is written in PHP and probably not very fast, both markdown and HTML versions of are saved. On execution, the HTML version is displayed, white the user edits the markdown version.

Click for demo The login button is at the bottom of the page. Updates have been disabled for demo.
Top-level folder:

Inc folder:

Blocks-html folder:

Blocks-md folder:

View CodeTop-level folder: edit-block.php ▾
<?php 

session_start();

$loggedin = false;
if (isset($_SESSION['admin'])) {    
   if ( $_SESSION['admin'] === 'thenipshoppe') { 
       $loggedin =  true;
   }
}

include ("inc/convert-markdown.php");
$pageid =  "edit-block";
if (isset ($_GET["block"])){   
    $blockid = filter_input(INPUT_GET, "block", FILTER_SANITIZE_STRING) ;
}       
$markdowntext = file_get_contents ("blocks-md/" . $blockid . ".txt");

if ($_SERVER ["REQUEST_METHOD"] == "POST" ) { 
   
    if (isset ($_POST['markdowntext'])) {
       $markdowntext = $_POST['markdowntext'];
        
       $filename = "blocks-md/" . $blockid . ".txt";
        //DISABLED FOR DEMO
       //file_put_contents ($filename, $markdowntext);
        
       $htmltext = convertTextToHtml ($markdowntext);  
       $filename =  "blocks-html/" . $blockid . ".php" ;
       //DISABLED FOR DEMO
      // file_put_contents ($filename, $htmltext);
    }
}
include ("inc/header.php");
?>
<main class = 'admin'>
<div class = 'half-column'>
    
    <h2>Edit text:  <?php echo ucwords ($blockid); ?></h2>
    <form method='post' action='edit-block.php?block=<?php echo $blockid ;?>'> 

        <textarea name = 'markdowntext'  rows = '10' cols = '60'><?php echo $markdowntext; ?></textarea>
        <br>
        <input  class = 'pinkbutton' type = 'submit' name = 'submit' value='Update'/>  

    </form> 
    </div><div class = 'half-column'>
    <br><br>
  
    
      <a class = 'greenbutton' href = 'index.php'>View Website</a>
    </div>
    
    <br><br>
</main>
<?php include "inc/footer.php";?>



 
 index.php ▾
<?php
session_start();
$loggedin = false;
if (isset($_SESSION['admin'])) {    
   if ( $_SESSION['admin'] === 'thenipshoppe') { 
       $loggedin =  true;
   }
}

$pageid = "home";
if (isset($_GET['page'])) {
    $pageid = $_GET['page'];
}
     
include ("inc/header.php"); 
echo "<main>";
if ($pageid === 'home') {
    echo "<div class = 'fourth-column'>";   
    echo  (file_get_contents ("blocks-html/specials.php")); 
    echo "</div><div class = 'half-column'>";   
    echo  (file_get_contents ("blocks-html/home.php"));
    echo "</div><div class = 'fourth-column'>";    
    echo  (file_get_contents ("blocks-html/hours.php")); 
    echo "</div>";
}
    
else if ($pageid === 'contact'  )  {
    echo "<div class = 'half-column'>";    
    echo (file_get_contents ("blocks-html/contact.php"));  
    echo "</div>";
}
else if ($pageid === 'about') {
    echo "<div class = 'half-column'>";    
    echo (file_get_contents ("blocks-html/about.php"));
    echo "</div>";
}    
echo "</main>";
include ("inc/footer.php"); 

?>
        
        
 login.php ▾
<?php

session_start();
$loggedin = false;
$username = $password = "";
$pageid = 'login';
include ("inc/header.php") ;


if ($_SERVER ["REQUEST_METHOD"] === "POST" ) { 
    
    // Checks if the user is trying to log in
    if (isset($_POST['username']))	{ 
        $username = filter_input(INPUT_POST, "username", FILTER_SANITIZE_STRING) ;
    }

    if (isset($_POST['password'])) {      
       $password = filter_input(INPUT_POST, "password", FILTER_SANITIZE_STRING) ;
    }

    if ($username === "nipusername"  && $password === "nippassword") { 
        $_SESSION['admin'] = 'thenipshoppe'; 
        $loggedin = true;
        echo "<h2>You are now logged in.</h2>";
    } 
}
 if ($loggedin === false) {
 
    ?>
    <main class = 'admin'> 
        <div class = 'title'><a href = 'index.php'>The Nip Shoppe</a></div>
        <h1>Log In</h1>        

            <h2>Please enter your username and password</h2>

            <form method="post" action="login.php">
               <h3><b>Username:</b>
               <input  type="text"  name="username" value= 'nipusername' /></h3><br>
               <h3 ><b>Password:</b>
               <input   type="password"  name="password" value='nippassword' /></h3><br>
               <input class = 'pinkbutton' type="submit" value = "Enter" name = 'submit'>
           </form>
    </main>
     <?php 
}
include ("inc/footer.php");
?>

        




   
 logout.php ▾
<?php


session_start();
session_unset();
session_destroy();
$pageid = 'logout';
$loggedin = false;
include ("inc/header.php");
echo "You are now logged out. ";
echo "<br>";
include ("inc/footer.php");
?>
inc folder: convert-markdown.php ▾
<?php

function convertTextToHTML ($text) {  
   
    $newstring0 = $text;
    $newstring0 = str_replace (PHP_EOL, "<br>", $newstring0);    
     
    //Hoizontal Rule - 4 underscores
    $newstring0 = str_replace ("____", "<hr>", $newstring0);       
    
    //Blockquote    
    if (strpos ($newstring0,">") !== false) {  
        if (strpos ($newstring0, "\>" ) != strpos ($newstring0, ">") - 1){
            $newstring1 = convertQuoteToHTML($newstring0);  
            $newstring0 = $newstring1;
        }       
    } 
    
     //H5    
    if (strpos ($newstring0,"##### ") !== false ) {            
        $newstring1 = convertHeadersToHTML("##### ", "<h5>", "</h5>", $newstring0);
        $newstring0 = $newstring1;
    }  
    
    //H4    
    if (strpos ($newstring0,"#### ") !== false ) {            
        $newstring1 = convertHeadersToHTML("#### ", "<h4>", "</h4>", $newstring0);
        $newstring0 = $newstring1;
    }    
    
    //H3
    if (strpos($newstring0, "### ") !== false) {           
        $newstring1 = convertHeadersToHTML("### ", "<h3>", "</h3>", $newstring0);  
        $newstring0 = $newstring1;
    }
    
    //H2       
    if (strpos ($newstring0,"## ") !== false ) {              
        $newstring1 = convertHeadersToHTML("## ", "<h2>", "</h2>", $newstring0);  
        $newstring0 = $newstring1;
    }
    
    //H1 
    if (strpos ($newstring0,"# ") !== false) {         
        $newstring1 = convertHeadersToHTML("# ", "<h1>", "</h1>", $newstring0); 
        $newstring0 = $newstring1;
    }     
     
    //Bold and Italic
    if (strpos ($newstring0,"***") !== false) {       
       $newstring1 = convertInLineToHTML("***", "<b><i>", "</i></b>", $newstring0);  
       $newstring0 = $newstring1;
    }   
   
    
    //Alternate Bold and Italic
    if (strpos ($newstring0,"___") !== false) {       
       $newstring1 = convertInLineToHTML("___*", "<b><i>", "</i></b>", $newstring0);  
       $newstring0 = $newstring1;
    }     
   
    
    //Bold
    if (strpos ($newstring0,"**") !== false) {       
       $newstring1 = convertInLineToHTML("**", "<b>", "</b>", $newstring0);  
       $newstring0 = $newstring1;
    }   
   
    
    //Alternate Bold
    if (strpos ($newstring0,"__") !== false) {       
       $newstring1 = convertInLineToHTML("__*", "<b>", "</b>", $newstring0);  
       $newstring0 = $newstring1;
    }     
      
    //Italics
    if (strpos ($newstring0,"*") !== false) {    
       if (strpos ($newstring0, "\*" ) != strpos ($newstring0, "*") - 1){
        $newstring0 = convertInLineToHTML("*", "<i>", "</i>", $newstring0); 
       }
    }  
    
    //Alternate Italics
    if (strpos ($newstring0,"_") !== false) {  
        if (strpos ($newstring0, "\_" ) != strpos ($newstring0, "_") - 1){
            $newstring0 = convertInLineToHTML("_", "<i>", "</i>", $newstring0); 
        }
    }  
    
    //image
    if (strpos ($newstring0, "!") !== false) {         
        $newstring1 = convertImagesToHTML($newstring0);
        $newstring0 = $newstring1;       
    }
       
    //link
    if (strpos ($newstring0, "[") !== false) {  
        if (strpos ($newstring0, "\[" ) != strpos ($newstring0, "[") - 1){
            $newstring1 = convertLinksToHTML($newstring0);
            $newstring0 = $newstring1;
        }
    }
    //unordered list
    if (strpos ($newstring0,"* ") !== false) {       
       $newstring0 = convertListToHTML  ($newstring0) ;              
    }  
            
    //numeric list
    if (preg_match ('/[0-9]\./', $newstring0) || preg_match ('/[0-9][0-9]\./', $newstring0)) {      
        $newstring0 = convertNumListToHTML  ($newstring0) ;
        
    }
   
    
    $newstring = $newstring0;    
    
    $newstring = str_replace ("ENDQUOTE", "</blockquote>", $newstring);
    $newstring = str_replace ("QUOTE", "<blockquote>", $newstring);  
    
    $newstring = str_replace ("ENDBLOCK", "</div>", $newstring);
    $newstring = str_replace ("BLOCK", "<div class = 'block'>", $newstring);     
     
    $newstring = str_replace ("ENDCAPTION", "</div>", $newstring);
    $newstring = str_replace ("CAPTION", "<div class = 'caption'>", $newstring);     
     
    //Justify Images
    $newstring = str_replace ("LEFT", "", $newstring); 
    $newstring = str_replace ("RIGHT", "", $newstring);   
    
    //Start new line after image
    $newstring = str_replace ("BREAK", "<div style = 'clear: both; float: none;'></div>", $newstring);    
     
    //Remove extra spaces between list items
    $newstring = str_replace ("</li>" . "<br>", "</li>", $newstring);
    
    //COLUMNS
    $newstring = str_replace ("3COL3", "</div><div class = 'third-width-column'>", $newstring);
    $newstring = str_replace ("3COL2", "</div><div class = 'third-width-column'>", $newstring);
    $newstring = str_replace ("3COL1", "<div class = 'third-width-column'>", $newstring);
   
    $newstring = str_replace ("2COL2", "</div><div class = 'half-width-column'>", $newstring);
    $newstring = str_replace ("2COL3", "<div class = 'half-width-column'>", $newstring);
    $newstring = str_replace ("ENDCOL", "</div>", $newstring);
    
    
    //REMOVE EXTRA LINE BREAKS
    $newstring = str_replace ("</h1><br>", "</h1>", $newstring);
    $newstring = str_replace ("</h2><br>" , "</h2>", $newstring);
    $newstring = str_replace ("</h3><br>" ,"</h3>", $newstring);
    $newstring = str_replace ("</h4><br>" ,"</h4>", $newstring);
    $newstring = str_replace ("</h5><br>" ,"</h5>", $newstring);    
    
    $newstring = str_replace ("<hr><br>" ,"<hr>", $newstring);
    $newstring = str_replace ("</div><br>" ,"</div>", $newstring);   
    
   
      
    return $newstring;    
}

function convertInlineToHTML($markdown, $htmlstart, $htmlend, $string) {
   
    $newstring = "";
  
    $array1 = explode ($markdown, $string);

    $flag = 0;
    foreach ($array1 as $id => $item) {
         if ($flag === 0) {             
            $newstring = $newstring . $item;
            $flag = 1;
             
        }
        else { 
            $newstring = $newstring . $htmlstart . $item . $htmlend;
            $flag = 0;
           
        }
    }   
    return $newstring;    
}

function convertHeadersToHTML ($markdown, $htmlstart, $htmlend, $string) {

    $newstring = "";
    $array1 = explode ("<br>", $string);
    $array2 = $array1;
    foreach ($array1 as $id =>  $item1) {
        
        $item1 = trim ($item1);
        $pos0 = strpos ($item1, $markdown);              
        if ($pos0 === 0) {
          
            $newitem = str_replace ($markdown, $htmlstart, $item1);
            $newitem = $newitem .  $htmlend;          
            $array2[$id] = $newitem;
        }           
          
    }
    $newstring = implode ("<br>", $array2);
    return $newstring;
}
    

function convertImagesToHTML($text) {
    $newstring = "";   
   
    $array1 = explode ("!", $text);
    $array2 = $array1;
    foreach ($array1 as $id =>  $item) {
        
        $item = trim ($item);    
        $newitem = $item;       

        if ($id === 0) {
            //beginning of string
            $newitem = $item;
        }
        else if (strpos ($item, "[")  !== 0) {
            //regular exclamation point, not image
            $newitem = "!" . $item;
        }
        else {
            $newimagefield =  "";
            $lastpos = 0;
            $pos1 = strpos ($item, "[");
            $pos2 = strpos ($item, "]");
            $pos3 = strpos ($item, "(");
            $pos4 = strpos ($item, ")");
            //echo "HERE" . $pos1 . " " . $pos2 . " " . $pos3  . "  " . $pos4;
            
          
            $altlength = $pos2 - $pos1;
            $srclength = $pos4 - $pos3;
            
            $alt = substr ($item, $pos1+1 , $altlength-1);         
            $src = substr ($item, $pos3+1, $srclength-1);  

            
              
            if (strpos ($item, "RIGHT")!== false) {
                $newimagefield = '<img src = "' .  $src . ' "  alt = " ' . $alt . '" class = "image-right"   />';   
            }
            else if (strpos ($item, "LEFT")!== false) {
                $newimagefield = '<img src = "' .  $src . ' "  alt = " ' . $alt . '" class = "image-left"   />';
            }
            else {
                $newimagefield = '<img src = "' .  $src . ' "  alt = " ' . $alt . '"   />'; 
            } 
             
            $newitem = $newimagefield . substr ($item, $pos4+1); 
            $newitem = str_replace ("LEFT", "", $newitem);
            $newitem = str_replace ("RIGHT", "", $newitem) ;
        }           
            
        $newstring = $newstring . $newitem;  
        
    }
   
    return $newstring;
}

function convertLinksToHTML($text){
    
    $newstring = "";
    $array1 =  explode("[", $text);   

    foreach ($array1 as $id => $item) {      

        if ($id === 0) {
            $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>";               

            //remove markup for image  and replace with html
           
            $newitem = $linkfield . substr ($item, $pos4+1);
        }
        $newstring = $newstring . $newitem;
    }
    return $newstring;
}

 function convertListToHTML ($string)   {
     //converts unordered list to html
     $newstring = "";
     $array1 = explode ("<br>", $string);
     $array2 = $array1;
     
     $endflag = true;
     $startflag = false;
     foreach ($array1 as $id =>  $item1) {
       
        $item1 = trim ($item1);
        $pos0 = strpos ($item1, "* ");  
        //Markdown character starts the line
        if ($pos0 === 0) {  
        
            $newitem = substr ($item1, 2);
            $newitem =  "<li>" . $newitem .  "</li>"; 
          
            if ($startflag === false) {
                //first list item
                $newitem = "<ul>" . $newitem;
                $startflag= true; 
                $endflag = false;
                $array2[$id] =  $newitem;
                
            }
            //continuing list item
            $array2[$id] =  $newitem;
            
        }
        //not list item
        else if ($startflag === true) {
            if ($item1 !== "" ) {
                 //this is the line following the last list line             
                 $array2[$id] = "</ul>" .  $item1;
                 $endflag = true;
                 $startflag = false;
                
             } 
        }
         
    } 
   
    $newstring = implode ("<br>", $array2);
    if ($endflag === false) {
        $newstring = $newstring ."</ul>";   
    }
    
    return $newstring;
}
     
function convertNumListToHTML ($string)   {
    //converts unordered list to html
     $newstring = "";
     $array1 = explode ("<br>", $string);
     $array2 = $array1;
    
     $endflag = true;
     $startflag = false;
     foreach ($array1 as $id =>  $item1) {
       
        $item1 = trim ($item1);
         //check is line starts with  1 or 2 digit number followed by a period
        if (is_numeric (substr ($item1, 0, 1)) &&  (substr ($item1, 1, 1) === "." || substr($item1, 2, 1) === ".")) {
            
            //this line part of numbered list  
            $pos1 = strpos ($item1, "."); 
            //remove characters up to first period
            $newitem = substr ($item1, $pos1 + 1);
            $newitem = "<li>" . $newitem;
            $newitem = $newitem .  "</li>"; 
           
            if ($startflag === false) {
                 
                //first list item
                $newitem = "<ol>" . $newitem;
                $startflag= true; 
                $endlfag = false;
                $array2[$id] =  $newitem;
               
            }
             else {
                //continuing list item
                $array2[$id] =  $newitem;
                
             }
         }
        
        //not list item
        else if ($startflag === true) {
           if ($item1 !== ""){
             //this is the line following the last list line             
             $array2[$id] = "</ol>" .  $array2[$id];
             $newstring = $newstring . "</or>". $item1;
             $endflag = true;
             $startflag = false;
           }
           
         } 
    } 
 
    $newstring = implode ("<br>", $array2);
    if ($endflag === false && $startflag === true) {
        $newstring = $newstring ."</ol>";   
    }
   
    return $newstring;
}
     
     
function convertQuoteToHTML ( $string) {

     $newstring = "";
     $array1 = explode ("<br>", $string);
     $array2 = $array1;
     
     $closingtagadded = false;
     $startingtagadded = false;
     foreach ($array1 as $id =>  $item1) {
        $newitem = "";
        $item1 = trim ($item1);
        $pos0 = strpos ($item1, ">");  
        $item1 = str_replace (">", "", $item1);
        //Markdown character starts the line
        if ($pos0 === 0) {          
            
            if ($startingtagadded === false) {
                $newitem = "<blockquote>" . $item1;
                $startingtagadded = true;
                $closingtagadded = false;
            }
            $array2[$id] =  $newitem;
        } 
        else if ($closingtagadded === false) {           
             //check if this is the line following the last list line 
             if ($startingtagadded === true) {
                 $array2[$id] = "</blockquote>" . $array2[$id];
                 $closingtagadded =  true;
                 $startingtagadded = false;
             }
         } 
    } 
 
    $newstring = implode ("<br>", $array2);
     if ($closingtagadded === false && $startingtagadded === true) {
         $newstring = $newstring . "</blockquote>" ;
     }
    return $newstring;
    
}
function  convertHorizontalRuleToHTML ($newstring0)  {
     $newstring = "";
     $array1 = explode ("<br>", $newstring0);
     $array2 = $array1;
     foreach ($array1 as $id => $item) {
         $item = trim ($item);       
         $pos1 = strpos ($item, "______");
      
         if ($pos1 !== false ) {     
            $array2[$id] = "<hr>";
         }
     } 
     $newstring = implode ("<br>", $array2);  
     $newstring = str_replace ("<br />" . "</li>", "</li>", $newstring);
     return $newstring;
}      
          
     
    
?>
 footer.php ▾
<?php

if ($loggedin ===  true ) {  
    echo "<br><br>Click on a text block to edit:" . "<br>";
    echo "<a class = 'greenbutton' href = 'edit-block.php?block=specials'>Specials </a>"; 
    echo "<a class = 'greenbutton' href = 'edit-block.php?block=hours'>Hours </a>";  
    echo "<a class = 'greenbutton' href = 'edit-block.php?block=home'>Home</a>"; 
    echo "<a class = 'greenbutton' href = 'edit-block.php?block=about'>About </a>";  
    echo "<a class = 'greenbutton' href = 'edit-block.php?block=contact'>Contact</a>";   
    echo "<br><br>";
   
    echo "<br><br>";   
    echo "<a  href = 'logout.php'>Log Out</a><br>";    
}
else {
    if ($pageid !== 'login') {
        echo "<a class = 'pinkbutton' href = 'login.php'>Log In</a><br>";
    }
}
?>
<a class = 'greenbutton' href = '../../projects'>Return to Projects</a><br><br>
<br><br><br>Copyright &copy; <?php echo  date('Y'); ?> Susan Rodgers, <a href = 'https://lilaavenue.com'>Lila Avenue</a><br><br>

<br><br>
<script src= "inc/scripts.js"></script> 
</body>
</html>
 header.php ▾
<!DOCTYPE html>
<html>
<head>    
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">  
   <title>'The Nip Shoppe'</title> 
   <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
   <link href="https://fonts.googleapis.com/css?family=Elsie" rel="stylesheet">       
   <link rel= 'stylesheet' type='text/css' href= 'inc/style.css'> 
</head> 
<body>
   <div class = 'header'>       
        <a class = 'menuitem'  href = 'index.php?page=about'>About</a>
        <a class = 'site-title' href = 'index.php'>The Nip Shoppe</a>
        <a class = 'menuitem'  href = 'index.php?page=contact'>Contact</a>
    </div> 
    
    
   <div class = 'banner'>
       <div class = 'greeting'>            
           <div class = 'description'>For All Your Catnip Needs </div>
       </div>
    </div>
   
        
        
 style.css ▾
body {
    font-family: "Lato", sans-serif;
    text-align: center;
    font-size: 1em;
    margin: 0 auto;
}
h1, h3 {
   font-family: 'Elsie', cursive;  
    letter-spacing: 1px;
}
.left {
    text-align: left;
}
.left h2 {
    text-align: center;
}

a {
   text-decoration: none; 
   color: green;
}

 a:hover {
    color: aqua;
}
/** PAGE STYLES */


/** HEADER AND MENU STYLES */
.header  {    
    text-align: center;  
    position: fixed;
    background-color: #356335;
    z-index: 1;
    display: block;
    margin: auto;
    top: 0;    
    width: 100%;
    border-top: 5px solid lightcoral;    
}
.header2 {
    text-align: center;     
    background-color: #356335;    
    display: block;
    margin: auto;   
    width: 100%;
    border-top: 5px solid lightcoral;   
    display: none;
}
a.site-title {
    font-family: 'Elsie', cursive;     
    text-align: center;     
    color: white;    
    font-size: 46px;   
    letter-spacing: 1px;  
}
.greeting {
    color: white;   
    font-size: 30px;
    font-weight: bold;
    padding-top: 200px;
    padding-bottom: 200px;
    position: relative;
    text-align: center;    
}
a.menuitem {
    color: white;
    display: inline-block;
    font-size: 1.3em;
    padding: 5px 10px;
    margin: 0 10px;
}

.banner {
    padding: 0px;
    display: inline-block;
    width: 100%;
    background-image: url("../images/green3.jpg");
    height: auto;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}
/** STANDARD PAGE SECTION STYLES */
main {    
    text-align: center;
    display: block;
    margin: auto; 
    background-color: #5a1a1a;
     background-color: #356335;
    color: white;
    padding-bottom: 30px;
    }
main a {
    color: white;
}
main.admin {
    background-color: white;
    color: #666;
}
.half-column {
    margin-top: 30px;
    width: 45%;      
    display: inline-block;   
    box-sizing: border-box;
    padding: 0 10px 30px 10px;
    background-color: white;    
    color: #356335;
    border: 2px solid lightcoral;
    line-height: 170%;
    vertical-align: top;
}
.admin .half-column {
    border: none;
}
.fourth-column {
    display: inline-block;
    width: 25%;
    box-sizing: border-box;  
    vertical-align: top;
    text-align: center;
    padding-top: 50px;
    background-color: #356335;
    color: white;
    line-height: 140%;
   }

/** BUTTON STYLES */

.greenbutton, .pinkbutton  {
    width: 100px;    
    border: 1px solid darkgreen;
    background-color: green;
    border-radius:  3px;
    padding: 5px;
    margin: 5px;
    display: inline-block;
    font-size: .8em;
}
.pinkbutton {
    background-color: lightcoral;
}

a.pinkbutton, a.greenbutton, input.pinkbutton {
    color: white;
    font-size: 1em;
}


textarea {
    font-family: "Lato", sans-serif;
    font-size: 1.1em;
    padding: 10px;
    border: 1px solid #ddd;   
    max-width: 95%;
}
.edit {
    text-align: left;
    width: 50%;
    margin: auto;
    
}

/** BREAKPOINTS */
@media only screen and (max-width: 800px) {   
    .header {
        display: none;
    }
    .header2 {
        display: block;
    }
    .site-title {
        width: 100%;
        display: block;
        margin: 0 auto;
    }
    .banner {
        max-height: 100px;
    }
    .greeting {
        padding: 30px;
    }
    .half-column, .fourth-column {
        width: 100%;
    }
    
}
blocks-html folder: about.php ▾
<h2>About Us</h2>
<br>The Nip Shopped was founded in 1979 by two college cats, Tom Twitchitail and Martin Pawclaw, during their sophomore year at Felinia College.  They met in a marketing class where they discovered that they both shared an interest in the psychological and medical benefits of catnip. 
<br>
<br>Although at the time, catnip was barely legal, they started a small business to procure nip for their fellow fraternity brothers.  To their surprise, their customer base expanded rapidly, partly due to their thorough knowledge of catnip quality and variety.  
<br>
<br>Soon, Felinia residents were enjoying catnip varieties that had previously been only available in places like Catalonia and Katmandu.   The business became so successful that Tom and Martin became Felinia's most successful feline entrepreneurs.
<br>
<br>From its simple beginnings in a college dormitory, today, The Nip Shoppe is run from a 20-acre office park with 5 warehouses and an ultramodern distribution center.   A new facility has just been built to conduct catnip research.  You can find "Ultra Catnip Oil' at your local pharmacy - one of the many medicinal oils recently introduced to the expanding collection of catnip products.
<br>
<br>Despite all the success, Tom and Marin still have a hands-on approach to managing their nearly 200 employees, all of whom enjoy discount Nip Shoppe products as a perk for their employment.   Their showroom on Main Street, Felinia is open 6 days a week.   Stop by and get some nip!
 contact.php ▾
<h2>Contact</h2><h4>You can contact us 7 days a week at (513) 418-1480</h4><h4>Send us an email at info@thenipshoppe.com</h4>
<br><b>Location</b>
<br>222 Scratching Post Road  
<br>Felinia, Ohio 45222
<br>
<br><b>Contact Us</b>
<br>(555)111-2222 <br>
<br>thenipshippe@furmail.com
<br>
<br>Our showroom is in the middle of downtown Felinia, Ohio - 3 minutes from the I-71 with lots of free parking.
<br>
<br>Find us on <b>Google Maps </b>
 home.php ▾
<h2> We carry the largest selection of quality catnip in all of Felinia</h2>
<br><b>Visit our showroom in beautiful downtown Felinia, Ohio
<br>Prepare to be amazed!</b>
<br>
<br><b>Varieties</b>
<br>Common Catnip - our most popular flavor, warm hues
<br>Camphor Catnip - faint hints of exotic locales
<br>Greek Catnip - our strongest variety - be careful!<br>Lemon Catnip - slightly sweet - a favorite with the kittens
<br>Catmint - bitter overtones, but popular with a select few
<br>
<br><b>Seasonal Products</b>
<br>Purple Haze 
<br>Lucy in the Sky
<br>Stairway To Heaven 
<br>
<br>
 hours.php ▾
<b>Hours</b>
<br>Monday 4pm - 11pm 
<br>Tuesday 4pm - 6pm  
<br>Wednesday 11am - 3pm 
<br>Thursday 11am - 11pm 
<br>Friday 7pm - midnight
<br>Saturday 2pm - 3pm 
<br>Sunday - closed 
<br>
 specials.php ▾
<h2>Specials!!</h2>While Supplies Last
<br>
<br><b>Dilettante Package</b>
<br>3oz of all 5 flavors
<br>$49.95
<br>
<br><b>Weekend Binge Package</b>
<br>3lbs current crop catmint 
<br>$63.63
<br>
<br><b>Hard Days Night Package</b>
<br>20oz Purple Haze 
<br>20oz Lucy in the Sky  
<br>20oz Stairway to Heaven 
<br>$82.77
blocks-md folder: about.txt ▾
## About Us

The Nip Shopped was founded in 1979 by two college cats, Tom Twitchitail and Martin Pawclaw, during their sophomore year at Felinia College.  They met in a marketing class where they discovered that they both shared an interest in the psychological and medical benefits of catnip. 

Although at the time, catnip was barely legal, they started a small business to procure nip for their fellow fraternity brothers.  To their surprise, their customer base expanded rapidly, partly due to their thorough knowledge of catnip quality and variety.  

Soon, Felinia residents were enjoying catnip varieties that had previously been only available in places like Catalonia and Katmandu.   The business became so successful that Tom and Martin became Felinia's most successful feline entrepreneurs.

From its simple beginnings in a college dormitory, today, The Nip Shoppe is run from a 20-acre office park with 5 warehouses and an ultramodern distribution center.   A new facility has just been built to conduct catnip research.  You can find "Ultra Catnip Oil' at your local pharmacy - one of the many medicinal oils recently introduced to the expanding collection of catnip products.

Despite all the success, Tom and Marin still have a hands-on approach to managing their nearly 200 employees, all of whom enjoy discount Nip Shoppe products as a perk for their employment.   Their showroom on Main Street, Felinia is open 6 days a week.   Stop by and get some nip! 
 contact.txt ▾
## Contact
#### You can contact us 7 days a week at (513) 418-1480
#### Send us an email at info@thenipshoppe.com

**Location**
222 Scratching Post Road  
Felinia, Ohio 45222

**Contact Us**
(555)111-2222 <br>
thenipshippe@furmail.com

Our showroom is in the middle of downtown Felinia, Ohio - 3 minutes from the I-71 with lots of free parking.

Find us on **Google Maps **
 home.txt ▾
##  We carry the largest selection of quality catnip in all of Felinia

**Visit our showroom in beautiful downtown Felinia, Ohio
Prepare to be amazed!**

**Varieties**
Common Catnip - our most popular flavor, warm hues
Camphor Catnip - faint hints of exotic locales
Greek Catnip - our strongest variety - be careful!
Lemon Catnip - slightly sweet - a favorite with the kittens
Catmint - bitter overtones, but popular with a select few

**Seasonal Products**
Purple Haze 
Lucy in the Sky
Stairway To Heaven 

 hours.txt ▾
**Hours**
Monday 4pm - 11pm 
Tuesday 4pm - 6pm  
Wednesday 11am - 3pm 
Thursday 11am - 11pm 
Friday 7pm - midnight
Saturday 2pm - 3pm 
Sunday - closed 
 specials.txt ▾
## Specials!! 
While Supplies Last

**Dilettante Package**
3oz of all 5 flavors
$49.95

**Weekend Binge Package**
3lbs current crop catmint 
$63.63

**Hard Days Night Package**
20oz Purple Haze 
20oz Lucy in the Sky  
20oz Stairway to Heaven 
$82.77   
Website 2 - Add Text Editing

Top-level folder:

Inc folder:

Blocks-html folder:

Blocks-md folder:

Recent Posts

Top-level folder:

inc folder:

blocks-html folder:

blocks-md folder:
