Adding Bootstrap markup and custom comment form

comment-form.php

@@ -0,0 +1,44 @@
+<?php if ( comments_open() ) : ?>
+
+    <!-- Kommentar eingeben -->
+
+            <h3><?php _e( 'Write Comment.', 'understrap' ); ?> <small class="text-danger"><?php _e( '*Mandatory', 'understrap' ); ?></small></h3>
+
+            <input type="hidden" name="redirect_to" value="<?php echo htmlspecialchars($_SERVER['REQUEST_URI']); ?>" />
+
+            <form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform" role="form">
+
+                <hr/>
+                <div class="form-group">
+                    <label for="author"><?php _e( 'Name', 'understrap' ); ?> <small class="text-danger">*</small></label>
+                    <input class="form-control" type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="22"/>
+                </div>
+
+                <hr/>
+                <div class="form-group">
+                    <label for="email"><?php _e( 'E-Mail', 'understrap' ); ?> <small>( <?php _e( 'Not public.', 'understrap' ); ?> )</small><small class="text-danger">*</small></label>
+                    <input class="form-control" type="email" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="22" tabindex="2"/>
+                </div>
+                <hr/>
+                <div class="form-group">
+                    <label for="url"><?php _e( 'Website', 'understrap' ); ?></label>
+                    <input class="form-control" type="url" name="url" id="url" value="<?php echo $comment_author_url; ?>" size="22" tabindex="3" />
+                </div>
+                <hr/>
+                <div class="form-group">
+                    <label><?php _e( 'Your Comment', 'understrap' ); ?> <small class="text-danger">*</small></label>
+                    <textarea class="form-control" name="comment" id="comment" style="width: 100%;" rows="10" tabindex="4"></textarea>
+                </div>
+
+
+
+                <div class="form-group  text-center">
+                    <input class="form-control btn btn-primary" name="submit" type="submit" id="submit" tabindex="5" value="<?php _e( 'Send comment.', 'understrap' ); ?>" />
+                    <input class="form-control" type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" />
+                </div>
+
+                <?php do_action('comment_form', $post->ID); ?>
+
+            </form>
+
+<?php endif ?>

comments.php

@@ -64,6 +64,6 @@ if ( post_password_required() ) {
 		<p class="no-comments"><?php _e( 'Comments are closed.', 'understrap' ); ?></p>
 	<?php endif; ?>
 
-	<?php comment_form(); ?>
+	<?php get_template_part('comment-form'); ?>
 
 </div><!-- #comments -->

content-none.php

@@ -10,7 +10,7 @@
 
 <section class="no-results not-found">
 	<header class="page-header">
-		<h1 class="page-title"><?php _e( 'Nothing Found', 'understrap' ); ?></h1>
+		<h2 class="page-title"><?php _e( 'Nothing Found', 'understrap' ); ?></h2>
 	</header><!-- .page-header -->
 
 	<div class="page-content">

content-page.php

@@ -8,7 +8,7 @@
 
 <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
 	<header class="entry-header">
-		<?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
+		<?php the_title( '<h2 class="entry-title">', '</h2>' ); ?>
 	</header><!-- .entry-header -->
 
 	<div class="entry-content">

content-search.php

@@ -10,7 +10,7 @@
 
 <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
 	<header class="entry-header">
-		<?php the_title( sprintf( '<h1 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h1>' ); ?>
+		<?php the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' ); ?>
 
 		<?php if ( 'post' == get_post_type() ) : ?>
 		<div class="entry-meta">

content-single.php

@@ -6,7 +6,7 @@
 
 <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
 	<header class="entry-header">
-		<?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
+		<?php the_title( '<h2 class="entry-title">', '</h2>' ); ?>
 
 		<div class="entry-meta">
 			<?php understrap_posted_on(); ?>

content.php

@@ -8,7 +8,7 @@
     
 	<header class="entry-header">
         
-		<?php the_title( sprintf( '<h1 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h1>' ); ?>
+		<?php the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' ); ?>
 
 		<?php if ( 'post' == get_post_type() ) : ?>
 		<div class="entry-meta">
@@ -22,7 +22,7 @@
         
 		<?php
 			/* translators: %s: Name of current post */
-			the_content( sprintf(
+			the_excerpt( sprintf(
 				__( 'Continue reading %s <span class="meta-nav">&rarr;</span>', 'understrap' ),
 				the_title( '<span class="screen-reader-text">"', '"</span>', false )
 			) );

functions.php

@@ -21,7 +21,7 @@ require get_template_directory() . '/inc/widgets.php';
 /**
  * Enqueue scripts and styles.
  */
-require get_template_directory() . '/inc/scripts.php';
+require get_template_directory() . '/inc/enqueue.php';
 
 /**
  * Implement the Custom Header feature.

inc/setup.php

@@ -81,3 +81,11 @@ add_action( 'after_setup_theme', 'understrap_setup' );
 /* Removes Adminbar - Comment out if you want see the bar. 
 */
 add_filter('show_admin_bar', '__return_false');
+
+/**
+/* Adding the Read more link to excerpts
+*/
+function new_excerpt_more( $more ) {
+	return ' <p><a class="read-more btn btn-default" href="'. get_permalink( get_the_ID() ) . '">' . __('Read More', 'understrap') . '</a></p>';
+}
+add_filter( 'excerpt_more', 'new_excerpt_more' );

inc/widgets.php

@@ -6,8 +6,8 @@ function understrap_widgets_init() {
 		'description'   => '',
 		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
 		'after_widget'  => '</aside>',
-		'before_title'  => '<h1 class="widget-title">',
+		'before_title'  => '<h3 class="widget-title">',
-		'after_title'   => '</h1>',
+		'after_title'   => '</h3>',
 	) );
 }
 add_action( 'widgets_init', 'understrap_widgets_init' );

sass/theme.scss

@@ -1,4 +1,4 @@
-@import "underscores/style"; // the _s starter theme basic styles <- Dont edit this files!
+@import "underscores/underscores"; // the _s starter theme basic styles <- Dont edit this files!
 @import "theme/theme_variables"; // Overwriting Bootstrap variables and for own variables
 @import "bootstrap/bootstrap"; // adding bootstrap <- Dont edit this files!
 @import "understrap/understrap"; // Some basic understrap styles. Helps to combine Bootsrap and _s theme and provides some basic styleing for additonal functions <- Dont edit this files!

sass/underscores/_underscores.scss

@@ -1,230 +1,90 @@
+/*
+underscores.scss - Does the same than the original style.scss file from the _s theme. But if you edit this you don´t overwrite changes if you upgrade the original _s scss source files 
+*/
+
 /*--------------------------------------------------------------
 >>> TABLE OF CONTENTS:
 ----------------------------------------------------------------
+1.0 Reset
+2.0 Typography
+3.0 Elements
+4.0 Forms
+5.0 Navigation
+	5.1 Links
+	5.2 Menus
+6.0 Accessibility
+7.0 Alignments
+8.0 Clearings
+9.0 Widgets
+10.0 Content
+	10.1 Posts and pages
+	10.2 Asides
+	10.3 Comments
+11.0 Infinite scroll
+12.0 Media
+	12.1 Captions
+	12.2 Galleries
 
-6.0 - Accessibility
-7.0 - Alignments
-8.0 - Clearings
-9.0 - Widgets
-10.0 - Content
-	10.1 - Posts and pages
-	10.2 - Asides
-	10.3 - Comments
-11.0 - Infinite scroll
-12.0 - Media
-	12.1 - Captions
-	12.2 - Galleries
 --------------------------------------------------------------*/
+@import "variables-site/variables-site";
+@import "mixins/mixins-master";
+
+/*--------------------------------------------------------------
+1.0 Reset
+--------------------------------------------------------------*/
+@import "reset";
+
+/*--------------------------------------------------------------
+2.0 Typography
+--------------------------------------------------------------*/
+//@import "typography/typography";
+
+/*--------------------------------------------------------------
+3.0 Elements
+--------------------------------------------------------------*/
+@import "elements/elements";
+
+/*--------------------------------------------------------------
+4.0 Forms
+--------------------------------------------------------------*/
+//@import "forms/forms";
+
+/*--------------------------------------------------------------
+5.0 Navigation
+--------------------------------------------------------------*/
+@import "navigation/navigation";
 
 /*--------------------------------------------------------------
 6.0 Accessibility
 --------------------------------------------------------------*/
-/* Text meant only for screen readers */
+@import "modules/accessibility";
-.screen-reader-text {
-	clip: rect(1px, 1px, 1px, 1px);
-	position: absolute !important;
-	height: 1px;
-	width: 1px;
-	overflow: hidden;
-}
-
-.screen-reader-text:hover,
-.screen-reader-text:active,
-.screen-reader-text:focus {
-	background-color: #f1f1f1;
-	border-radius: 3px;
-	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
-	clip: auto !important;
-	color: #21759b;
-	display: block;
-	font-size: 14px;
-	font-weight: bold;
-	height: auto;
-	left: 5px;
-	line-height: normal;
-	padding: 15px 23px 14px;
-	text-decoration: none;
-	top: 5px;
-	width: auto;
-	z-index: 100000; /* Above WP toolbar */
-}
 
+/*--------------------------------------------------------------
+7.0 Alignments
+--------------------------------------------------------------*/
+//@import "modules/alignments";
 
 /*--------------------------------------------------------------
 8.0 Clearings
 --------------------------------------------------------------*/
-.clear:before,
+@import "modules/clearings";
-.clear:after,
-.entry-content:before,
-.entry-content:after,
-.comment-content:before,
-.comment-content:after,
-.site-header:before,
-.site-header:after,
-.site-content:before,
-.site-content:after,
-.site-footer:before,
-.site-footer:after {
-	content: '';
-	display: table;
-}
-
-.clear:after,
-.entry-content:after,
-.comment-content:after,
-.site-header:after,
-.site-content:after,
-.site-footer:after {
-	clear: both;
-}
 
 /*--------------------------------------------------------------
 9.0 Widgets
 --------------------------------------------------------------*/
-.widget {
+@import "site/secondary/widgets";
-	margin: 0 0 1.5em;
-}
-
-/* Make sure select elements fit in widgets */
-.widget select {
-	max-width: 100%;
-}
-
-/* Search widget */
-.widget_search .search-submit {
-	display: none;
-}
 
 /*--------------------------------------------------------------
 10.0 Content
 --------------------------------------------------------------*/
-/*--------------------------------------------------------------
+@import "site/site";
-10.1 Posts and pages
---------------------------------------------------------------*/
-.sticky {
-    font-size:inherit;
-}
-.hentry {
-	margin: 0 0 1.5em;
-}
-.byline,
-.updated {
-	display: none;
-}
-.single .byline,
-.group-blog .byline {
-	display: inline;
-}
-.page-content,
-.entry-content,
-.entry-summary {
-	margin: 1.5em 0 0;
-}
-.page-links {
-	clear: both;
-	margin: 0 0 1.5em;
-}
-
-/*--------------------------------------------------------------
-10.2 Asides
---------------------------------------------------------------*/
-.blog .format-aside .entry-title,
-.archive .format-aside .entry-title {
-	display: none;
-}
-
-/*--------------------------------------------------------------
-10.3 Comments
---------------------------------------------------------------*/
-.comment-content a {
-	word-wrap: break-word;
-}
-.bypostauthor {
-}
 
 /*--------------------------------------------------------------
 11.0 Infinite scroll
 --------------------------------------------------------------*/
-/* Globally hidden elements when Infinite Scroll is supported and in use. */
+@import "modules/infinite-scroll";
-.infinite-scroll .paging-navigation, /* Older / Newer Posts Navigation (always hidden) */
-.infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */
-	display: none;
-}
-/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before */
-.infinity-end.neverending .site-footer {
-	display: block;
-}
 
 /*--------------------------------------------------------------
 12.0 Media
 --------------------------------------------------------------*/
-.page-content img.wp-smiley,
+@import "media/media";
-.entry-content img.wp-smiley,
-.comment-content img.wp-smiley {
-	border: none;
-	margin-bottom: 0;
-	margin-top: 0;
-	padding: 0;
-}
-/* Make sure embeds and iframes fit their containers */
-embed,
-iframe,
-object {
-	max-width: 100%;
-}
-
-/*--------------------------------------------------------------
-12.1 Captions
---------------------------------------------------------------*/
-.wp-caption {
-	margin-bottom: 1.5em;
-	max-width: 100%;
-}
-.wp-caption img[class*="wp-image-"] {
-	display: block;
-	margin: 0 auto;
-}
-.wp-caption-text {
-	text-align: center;
-}
-.wp-caption .wp-caption-text {
-	margin: 0.8075em 0;
-}
-
-/*--------------------------------------------------------------
-12.2 Galleries
---------------------------------------------------------------*/
-.gallery {
-	margin-bottom: 1.5em;
-}
-.gallery-item {
-	display: inline-block;
-	text-align: center;
-	vertical-align: top;
-	width: 100%;
-}
-.gallery-columns-2 .gallery-item {
-	max-width: 50%;
-}
-.gallery-columns-3 .gallery-item {
-	max-width: 33.33%;
-}
-.gallery-columns-4 .gallery-item {
-	max-width: 25%;
-}
-.gallery-columns-5 .gallery-item {
-	max-width: 20%;
-}
-.gallery-columns-6 .gallery-item {
-	max-width: 16.66%;
-}
-.gallery-columns-7 .gallery-item {
-	max-width: 14.28%;
-}
-.gallery-columns-8 .gallery-item {
-	max-width: 12.5%;
-}
-.gallery-columns-9 .gallery-item {
-	max-width: 11.11%;
-}
-.gallery-caption {}

sass/underscores/style.scss

@@ -56,7 +56,7 @@ and Blueprint http://www.blueprintcss.org/
 /*--------------------------------------------------------------
 2.0 Typography
 --------------------------------------------------------------*/
-@import "typography/typography";
+//@import "typography/typography";
 
 /*--------------------------------------------------------------
 3.0 Elements
@@ -66,7 +66,7 @@ and Blueprint http://www.blueprintcss.org/
 /*--------------------------------------------------------------
 4.0 Forms
 --------------------------------------------------------------*/
-@import "forms/forms";
+//@import "forms/forms";
 
 /*--------------------------------------------------------------
 5.0 Navigation
@@ -81,7 +81,7 @@ and Blueprint http://www.blueprintcss.org/
 /*--------------------------------------------------------------
 7.0 Alignments
 --------------------------------------------------------------*/
-@import "modules/alignments";
+//@import "modules/alignments";
 
 /*--------------------------------------------------------------
 8.0 Clearings