Create A Blog On Your Mobile Phone With Jekyll On Github

Welcome to the series "How to create a blog on your mobile phone with Jekyll on Github"

Yep i said it... You can create a free blog from your mobile phone, so get ready to start your journey as a blogger...

a lot of people do ask:

  1. How can i create a website with my phone?
  2. Can we blog from mobile?
  3. what is the best phone for blogging?

Yes, Yes and Yes you can create a website with your phone, you can blog from your mobile phone and you dont need a special phone for blogging.

What is moblie bloging?

Mobile blogging is a method of publishing to a website or blog from a mobile phone or other handheld device. A mobile blogs help habitual bloggers to post write-ups directly from their phones even when on the move.

Well i hope from the defination you understand what a mobile blog is and what we are trying to do here... well as you might have guessed we are trying to create a free website or blog which you can update, design and post to directly from your mobile phone.

Requirements:

  1. HTML
  2. CSS
  3. JAVASCRIPT (optional)
  4. Github account
  5. SPCK Editor

Before you beging this series with me, it is required you just have a basic knowledge of Html, Css, and javascript is optional for now, well if you dont have a basic knowledge and you are just hearing about all this for the first time, dont worry this articles Getting Started With The Web , Structuring the web with HTML should basically get you started.

Other requirements are the github account: Github is a subsidiary of Microsoft which provides hosting for software development and version control using Git.
Now dont worry about the defination, you probably will never need it anyway. All you need is to Create an Account(which is totally free), head over to Github.com and create an account.

Then Spck Editor, this is just a really cool code editor and js sandbox, this is the closest thing that is close to vscode on a mobile phone.
Head over to play store search for "Spck editor" and install it. This editor is what we'll use to write to our blog...

Note: It is required that you create a github account, and have downloaded and installed the app before you continue.
Please don't use Opera Mini, use a modern browser like Chrome or Firefox

Getting Started

Now make sure you have created your Github account by signing up
Now Click below link (Open in a different tab)
Jekyll now starter theme

You should see a page that looks like this
You should see a page that looks like this

Now its time to Fork the starter theme
click on the Forks icon

Jekyll now fork icon
Click on the forks icon

The page would reload and you would see a desktop view of the page, just look at the right side of the page at the header (top of the webpage) and click on fork

Click the fork icon there
Click the fork icon there

After doing that the next page you are going to see would ask you to change your Forked theme name
Now change the name of the website to: "github-username.github.io"

Old one looks like this
Old one looks like this
Change it to something like this with your own github username
Change it to something like this with your own github username

Now its time to create a github token for the spck editor app you downloaded earlier...
click on the dropdown menu at the top of the page

Dropdown menu
Dropdown menu

    from the dropdown:
  1. Click on settings
  2. developer settings
  3. personal access tokens
  4. Generate New Token
  5. You may be asked for password, just enter your github password and continue
    1. Give it a note: Spck editor
    2. click on the repo box (select everything under it)
    3. Scroll select write:packages and admin:org
    4. Click "Generate Token"

Select the repo box
Select the repo box

After you have generated your token ensure you copy it to your phone clipboard because you wont see again unless you re-generate it.

Ensure you copy the token
Ensure you copy the token

If you have followed this guide perfectly, you are just a few steps away from your newly phone managed blog or website.

Moving on, Do you remember the "Spck editor" you downloaded earlier? Yep i guess you do
Now open it up
And you should see something that looks like this image below

Yep. Click on the first tab and you should see this
Yep. Click on the first tab and you should see this

Next step is to look at the PROJECTS tab
Click on the third icon (The fork icon)

On the projects tab, click the fork icon (the third icon)
On the projects tab, click the fork icon (the third icon)

When you click on fork icon
Select credentials
Set up your Credentials as follows:
name: Github username
password/token: The token you Generated earlier (The one you copied)
email: for email (The one used in opening your github account)
Then just Click on "OK"

Now its time to clone your website to your mobile phone
Click on the Fork icon again
Just enter your Url like this

clone website on Spck editor
Enter your repo link

url: https://github.com/github-username/github-username.github.io
just change "github-username" to your own github username
then just Click on "OK"
and wait for your website to clone (Speed depends on your internet connection, mine took a few seconds)

Successfully clone website on Spck editor
After you have finished cloning you should see something like this

Yep, You guessed it, that's all. If you followed the steps correctly then i congratulate you(yeah you can feel proud). You have created a free website, and you can now manage, edit and design it on your mob ile phone.

To view your website
go to your browser
type in your website url
"github-username.github.io"
in my case "sprucestatic.github.io"

Free website created with jekyll on github
Your new site should look like this

Honestly you should be proud now. Welcome to the bloggers and website owners association of the world.
Now you can go and tell your family members, friends, share it on facebook and twitter, about your new website...

Though not really much now, Before the end of this series you will learn how to create and update a fully functional blog from your mobile phone...

Next step is Customizing your new website, and introducing you to GIT on your mobile phone... Thanks for reading.

Next part of this series

Create a blog on your mobile phone part 2