Skip to content

Instantly share code, notes, and snippets.

@manbearwolf
Last active October 30, 2017 06:01
Show Gist options
  • Select an option

  • Save manbearwolf/f3934676a4cdac740580482f2053f35c to your computer and use it in GitHub Desktop.

Select an option

Save manbearwolf/f3934676a4cdac740580482f2053f35c to your computer and use it in GitHub Desktop.
To Move Blue Post Wrapper To Under Picture Procedure... (BlogInn) (https://themeforest.net/item/bloginn-bold-theme-for-jekyll/15504914/comments)
<div class="entry-header-wrap"> <!-- Mvoe From -->
{% if post.banner_image %}
<a href="{{site.baseurl}}{{post.url}}" class="post-thumbnail"><img src="{{ "/images/posts/" | append: post.banner_image | prepend: site.baseurl }}" alt="{% if post.banner_image_alt %}{{ post.banner_image_alt }}{% else %}{{ post.title }} {% endif %}"></a>
{% endif %}
<!-- Mvoe to Under banner_image --> <div class="entry-header-wrap">
<!-- Do this for all entry-header-wraps in files post.html page.html-->
.entry-title {
background-color: $picton-blue;
clear: both;
color: $white;
float: left;
font-size: 36px;
// margin: 60px 0 0;
margin: 0 0 0;
max-width: 75%;
padding: 30px;
-ms-word-wrap: break-word;
word-wrap: break-word
}
<img src="/images/archive.jpg" height="auto" width="100%">
<div class="entry-header-wrap">
@manbearwolf

manbearwolf commented Oct 29, 2017

Copy link
Copy Markdown
Author

index.html (real line numbers)

@manbearwolf

manbearwolf commented Oct 29, 2017

Copy link
Copy Markdown
Author

if you want banner_image in the archive (taken from pages.html)

front matter...

--------------
banner_image: archive.jpg
---------------
{% if page.banner_image %}
<div class="post-thumbnail">
<img src="{{ "/images/" | append: page.banner_image | prepend: site.baseurl }}" alt="{% if page.banner_image_alt %}{{ page.banner_image_alt }}{% else %}{{ page.title }}{% endif %}">
</div><!-- .post-thumbnail -->
{% endif %}

in the place of img src...

@manbearwolf

manbearwolf commented Oct 30, 2017

Copy link
Copy Markdown
Author

The real answer is...

.post-thumbnail + .entry-title {
   bottom: 0px;
    left: 0px;
    position: absolute;    
}

and edit it like this:

.post-thumbnail + .entry-title {
   margin: 0;
}

That's it!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment