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; }