My WordPress setting

Insert search form on theme header (header.php)

<?php get_search_form(); ?>

or

<div class="KimSearchBar"><?php get_search_form();?></div>

My CSS for TwentySeventeen theme

header { 
 margin-bottom: 0em !important;
}

p{
 margin: 5px 0px;
}

code{
 font-size: 0.95em;
}

pre {
 color: black;
 background: #eee;
 font-family: monospace, monospace;
 font-size: 0.95em;
 line-height: 16px;
 max-width: 100%;
 overflow: auto;
 padding: 8px;
 border: 1px solid rgba(0,0,0,0.15);
 border-radius: 4px;
 margin: 5px 0px;
 white-space: pre-wrap;
}

.site-content .wrap #primary{
 max-width: 900px !important;
}

.page-header { 
 padding-bottom: 0em; 
}

.entry-title{
 border: 0px solid silver;
 text-decoration: underline;
}

.site-content {
 padding: 0.5em 0 0;
}

.KimSearchBar{
 display: block;
 margin-top: 0px;
 margin-right:3px;
 width: 100%;
 border: 0px solid silver;
}

.search-field{
 height: 33px;
}

.search-submit{ 
 font-size: 8px;
}

.site-content{

}

.entry-header .entry-title{
 font-weight: bold; 
 font-size: larger;
}

.entry-content{
 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
 font-size: 13px; 
}

.panel-content .wrap{ 
 padding: 0px 0px; 
}

.page-one-column .panel-content .wrap { 
 max-width: 910px;
}

.site-info{
 display: none;
}

.entry-date.published{
 display: none;
}

.byline{
 display: none !important;
}

#masthead.site-header{
}

CSS for KimSearchBar

.KimSearchBar{
 display: block;
 float: right;
 margin-top: 0px;
 margin-right:3px;
 }

My highlight <code> tag

color: #eeeeee; 
border-radius: 3px; 
border-color: #222222 #222222 #000000; 
padding: 2px; 
background-image: linear-gradient(#333333, #000000); 
background-repeat: repeat-x;

My preferred Plugins

Yellow Pencil
OnePress Image Elevator
TinyMCE Advanced
Visual Editor Custom Buttons

 

Increase width of visual editor

sudo nano themes/twentyseventeen/assets/css/editor-style.css
body { 

 ... 
 max-width: 100%; 

}

My preferred CSS

.site-content{
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
font-size: 13px; 
line-height: 18px;
}

 

Leave a Comment

Your email address will not be published. Required fields are marked *