kaxigt.com

Jag gillar verkligen temat Twenty Sixteen men det finns vissa saker som är mindre bra med temat. En av dessa är den ”svarta ramen”, och vill man inte byta färg på den, kanske öka marginalerna och ha den kvar, så är det lika bra ta bort den helt hållet. Här nedan listar jag några matnyttiga tips om hur du kan tweaka temat. Alla förändringar som görs i modertemats filer kommer att försvinna vid varje uppdatering så jag rekommenderar att du gör ett barntema. Alla nya koder och css lägger du alltså in i barntemats stilmall.

Style.css

Get rid of black border – alternative 1

body {
    background-color: #ffffff;
}
.site {
    margin: 0 auto !important;
}
body:not(.custom-background-image):before,
    body:not(.custom-background-image):after {
    height: 0px !important;
}
.site-inner {
    overflow: hidden !important;
}

Get rid of black border – alternative 2 (kaxigt style)

body {
    background-color: #ffffff;
}
body:not(.search-results) article:not(.type-page) img.below-entry-meta,
	body:not(.search-results) article:not(.type-page) figure.below-entry-meta {
		clear: both;
		display: block;
	}
/*removes the dark border*/
body:not(.custom-background-image):before, body:not(.custom-background-image):after {
	display: none;
}
body:not(.custom-background-image):before,
	body:not(.custom-background-image):after {
		height: 0px !important;
	}
.site {
    margin: 0 auto !important; /* or margin:0; */
}
.site-inner {
	margin: 0 auto;
	max-width: 1600px; <-- your custom width
	width:100%;
	position: relative;
}

Fullwidth no border without ’get_sidebar’

body:not(.search-results) article:not(.type-page) img.below-entry-meta,
	body:not(.search-results) article:not(.type-page) figure.below-entry-meta {
		clear: both;
		display: block;
	}

/*removes the dark border*/
body:not(.custom-background-image):before, body:not(.custom-background-image):after {
	display: none;
}

body:not(.custom-background-image):before,
	body:not(.custom-background-image):after {
		height: 0px !important;
	}
body #content .post .entry-content { 
    float: none;
    width: 100%;
}
body #content .post .entry-footer {
    display: none;
}

@media only screen and (max-width:910px){
    body #content .post .entry-content {
        float: none;
        margin: 0 2.6923%;
        width: auto;
    }
}

@media only screen and (max-width:1600px){
    .content-area {
        float: none;
        margin: 0 2.6923%;
        width: auto;
    }
}
/* open up for more content space and wider the theme*/
.entry-content,
.entry-summary,
.page-content {
    width: 98%!important;
    padding:0 1%;
    margin:0 auto!important;
    position:relative;
}
.page .entry-content 
{width: 98%!important;
    padding:0 1%;
}
/* CONTENT BOTTOM
  =============================================== */

#content-bottom-widgets .widgets-area {
    width:100%;
}

/* FULLWIDTH (WHEN USED INSTEAD OF TWEAKS)
============================================*/
.full-width {
    width: 100%;
    max-width:1900px; <-- your custom width
    margin:0 auto;
    position:relative;
}
.site-inner-full {
    width: 100%;
}
.site-content-full {
    padding:0 10px;}
.entry-content-full {
    margin-right: auto;
    margin-left: auto;
}
@media screen and (min-width: 56.875em) {
    .entry-content-full {
        margin-right: auto;
        margin-left: auto;
    }
}
@media screen and (min-width: 44.375em) {
    .entry-content-full {
    margin-right: auto;
    }
}
/* THIS ORDER IN DOC
============================================*/

<div class="site-inner-full">
<div class="site-content-full">
</div>
</div>

Remove the space above the Site Title

#masthead {
padding: 0 0 10px 0!important;

Change the font color, font, size of sidebar widget title

.widget .widget-title {
color:#666!important;
font-size: 1.25rem!important;
margin-bottom:1em;
font-family: "Times New Roman"; Georgia, Serif;
}

Reduce the spacing or gap between homepage posts

.home article {
margin-bottom: 3%!important;

Reduce spacing or gap between individual post

.site-header {
padding: 10 0px !important;
}

Border below the header

.site-header {
padding: 10px 0!important;
border-bottom: 2px solid #666!important;
margin-bottom: 10px !important;
}

Change sidebar widget’s top border color and spacing

widget {
border-top: 2px solid#ccc!important;
margin-bottom: 10px !important;
padding-top: 10px !important;
}

Resize the author logo

.comment-author img, .author-info img, .widget .avatar, .byline img {
	-ms-transform: scale(0.87,0.87);
	-webkit-transform: scale(0.87,0.87);
	transform: scale(0.87,0.87);
}

Remove side borders of the featured image

.post-thumbnail {
	margin: -26px -30px 26px;
}

Move sidebar to the left

@media screen and (min-width: 56.875em) {
.sidebar {
float: left;
margin-right: 75%;
margin-left: 0;
}

.content-area {
float: right;
margin-right: 0;
margin-left: -100%;
}
}

Make single post fullwidth

/* Remove the CSS rules below */

/* line 3512 */

body:not(.search-results) article:not(.type-page) .entry-footer {
	float: left;
	margin-top: 0.1538461538em;
	width: 21.42857143%;
	}
	
/* line 3484 */

body:not(.search-results) article:not(.type-page) .entry-content {
	float: right;
	width: 71.42857144%;
}

/* Find and remove the CSS rules below to make them inline */

.single .byline,
.full-size-link,
body:not(.search-results).group-blog .byline,
body:not(.search-results) .entry-format,
body:not(.search-results) .cat-links,
body:not(.search-results) .tags-links,
body:not(.search-results) article:not(.sticky) .posted-on,
body:not(.search-results) article:not(.type-page) .comments-link,
body:not(.search-results) article:not(.type-page) .entry-footer .edit-link {
	display: block;
	margin-bottom: 0.5384615385em;
}

body:not(.search-results) article:not(.type-page) .entry-footer .avatar {
	display: block;
	height: auto;
	margin: 0 0 0.5384615385em;
	width: 49px;
}

body:not(.search-results) article:not(.type-page) .entry-footer > span:not(:first-child):before {
	display: none;
}