How to add a script in an octopress post? - blogs

Octopress posts contain markdown markup.
I want to add a widget which requires to put a <script src="http://some-widget.com"> in the post.
The problem is that markdown turns it into a code block and it doesn't get executed.
I know that i can edit the .html output directly but the next time that i will do rake generate my edit will be lost.
Any ideas?

Have you tried surrounding the code with a <div> tag? It's worked for me on several markdown/html issues.

Related

How to customize Jekyll Minima's Subscribe button

I am building a GitHub blog with FastPages.
The automated process to create articles from Jupyter notebooks is working fine. However, the "Subscribe" button at the bottom of the page points to https://my_git_account.github.io/My_FastPages_Blog/feed.xml, which leads to an error page saying, "This XML file does not appear to have any style information ..."
I have followed FastPages's instruction here, and checked this issue. Unfortunately, there were no clear answers.
I'd like to modify the "Subscribe" button to point to the RSS link (for example https://feedrabbit.com/?url=https://my_git_account.github.io/My_FastPages_Blog/feed.xml.
Any advice on how should I do this? As I struggled to find my way by modifying the _config.yml file and the index.html files, it was not working, as whenever I ran: make server. All the files were generated as before.
I really appreciate any help you can provide.
After a while, I found the answer by myself.
In case someone needs this, here is what I did:
I went to download the footer.html from Jekyll Git repo.
Next, I override its HTML contents:
<p class="feed-subscribe">
<a href="https://feedrabbit.com/?url=https:put_the_link_you_want_HERE">
<svg class="svg-icon orange">
<use xlink:href="{{ 'assets/minima-social-icons.svg#rss' | relative_url }}"></use>
</svg><span>Subscribe</span>
</a>
</p>
I hope the Fastpages team can update this solution, the Subscribe button in their template has been unused for so long.

How to make GitHub's Jekyll work with index.html?

I'm trying to make a GitHub page. At the beginning, I use GitHub generator. I included Gemfile and _config.yml to generate SEO tag and it works as expected. The generated site will include the following section.
<!-- Begin Jekyll SEO tag v2.6.1 -->
<meta ...
<!-- End Jekyll SEO tag -->
Now, I've just updated my site to the new one using HTML template from HTML5 UP. It's up and run normally, however, I cannot find a way to make Jekyll generate SEO tag for my index.html file. I've tried to add triple dashes (front matter) to my index.html on the first line.
---
---
<!DOCTYPE HTML>
<!-- Other code below -->
The thing is, it partially break the site (page isn't rendered properly). Therefore, I've to copy/paste the generated tag and add them manually to my code. Is there a way to make Jekyll properly create SEO tags for my site? Or did my misunderstand something very basic here?
To be clear, I've very limited knowledge in web development, that's why I use a template in the first place. Here is my page in case it helps clarify the question https://hunghvu.github.io/ and here is its GitHub repository incase you want to know the file structure.
Update
(09/30)
I attempted to turn the index.html file into index.md while still keeping all the code (plus the tripled dashes). In a sense, it works. The page is generated, but still, it's not rendered properly as when I use html format. I'm aware that the way to actually build site using Jekyll is much different, but that does not answer my question.
In case it is necessary to show what I mean by saying "not properly rendered", I will update this question later on.
(09/31)
The picture below is how my page looks like when I add front matter and {% seo %}. Notice that when I first go to the page, the side bar is already in SOME OTHER WORK, or last section. It should be on the WELCOME. The WELCOME section is not rendered and sidebar functionality is broken.
Problem
GitHub pages gem is not included in your project, therefore GitHub is not running Jekyll build. Furthermore, you have nothing specified in your front matter. You also have no layout.
Solution
Include gem "github-pages", "~> VERSION", group: :jekyll_plugins in your Gemfile.
Notes
Consider using front matter and creating a layout file _layouts/default.html and moving everything except what’s in body (including SEO)to the layout file. The index.html should extend the layout by specifying layout property in front matter.
References
Front Matter: https://jekyllrb.com/docs/front-matter/
GitHub (step 9): https://docs.github.com/en/free-pro-team#latest/github/working-with-github-pages/creating-a-github-pages-site-with-jekyll

Why the jekyll is not running?

Hello I have a problem with my blog homepage (https://igorkowalczyk.github.io/blog) does not work, but normal posts such as (https://igorkowalczyk.github.io/blog/categories/offtop) do work.
I don't even know what the problem is.
I suspect that it's a problem with index but I don't know exactly.
Someone knows maybe for what it does not work?
Your IgorKowalczyk/blog/index.md uses paginator.posts, which should be working only in HTML files, not md (markdown files).
The categories/offtop.html is an HTML file, properly rendered/generated by Jekyll.
The pagination logic should not sit inside the content files (e.g. individual post or document files). It belongs in the layout files.
If you place markdown code into your layout or include files you will have to explicitly pass it through the markdownify filter.
My recommendation is to keep your content (e.g. blog posts) in .md files (which will only contain markdown syntax) and everything dealing with the structure of your site in .html files (which will only include HTML syntax).
The OP MAJO mentions in the comments having to restore the right content for the index.html file: commit ac2ad43

Possible to open/read an .md/.html file automatically in my main HTML for blog site?

I'm trying to create a blog using HTML/CSS. So far, I've created and styled the page and I want to start adding blog posts.
Instead of filling up my HTML document with the blog article in a <p> or <h*something*> tag, I was hoping I can link to a local .md file in a blog-articles folder. That way, I can write the blogs in as .md files, stash them in the folder, and link them into my website.
Is this possible?
edit
I'd basically like to replace the typed out blog post in the main HTML with a link to either a .md or .html file that opens/reads automatically.
https://codepen.io/kremebey/pen/RJdQJp
[I've commented out the part of the HTML where the adjustment would likely occur]
You could use something like: https://github.com/evilstreak/markdown-js which is a great markdown visualizer. Or you could convert it to HTML with this: http://sebastianraschka.com/Articles/2014_markdown_syntax_color.html Hope this helps!

Jekyll link within page

I'm using Jekyll on Github, and I wonder whether there's a way to link to a section within a page. Say I have a section like
## Section 1 ##
section content
and later in the same page I want to link to this section. I've found how to link to another page within the blog and do footnotes, but not this.
As a note, I use markdown: kramdown in my _config.yml
kramdown supports the automatic generation of header IDs if the option
auto_ids is set to true (which is the default). This is done by
converting the untransformed, i.e. plain, header text
So in the above example ## Section 1 ##, it would generate the following id: id="section-1", then the anchor is linked to via the A element:
Section One
Or in plain kramdown/markdown: [Section 1](#section-1)
It seems that this has been changed to #heading-section-1 (checking on Jekyll 3.7.3 right now).
As a way to figure this out on your own, you can inspect the element and see the id being used on the rendered page.
I found a nice repository that helps add anchors to all headers in three simple steps.
From docs:
Download the anchor_headings.html file from the master branch
Toss that file in your _includes folder
Where you typically would put {{ content }} in your layout,
you would instead use this Liquid tag to output your page's content:
{% include anchor_headings.html html=content anchorBody="#" %}
As result you will see:
Which is easy to customize.
If the section of the page you want to jump to is not a section heading, then this accepted answer didn't work for me. The following worked for me:
[jump](#final-solution)
<div id="final-solution"></div>