OITO installation guide

Hello! 🤗

Hey you! First of all, thanks for buying from The Basic Page. You deserve all the love and I hope you really enjoy your new design! This is a guide with the instructions to install your theme. Feel free to contact me if you have any question or problem during the installation. I will be glad to help you!
So, here we go!

1. How to upload your new theme

1. Go to the THEME section of your blog.

2. Click on the down arrow near "Customize".

3. Click on the BACKUP button and download the theme you are currently using on your blog.

4. After, click on the RESTORE button.

5. Find the file called OITO v1.4 (theme) and upload it.

Congrats! 👏 You have uploaded your new theme.

Now it is time to set up the gadgets. To do that, go to the LAYOUT section.

2. Social media icons

Available icons:

Behance Bloglovin' Deviantart Dribbble Email Etsy Facebook Flickr Goodreads Instagram Last.fm Linkedin Medium Pinterest Reddit Snapchat SoundCloud Spotify Telegram Tiktok Tumblr Twitch Twitter Vimeo Vine VK Youtube Feed RSS

1. Find the SOCIAL ICONS gadget and click on the pencil to edit it.

2. Click on ADD A NEW ITEM for each icon you want to have on your blog.

3. For each icon you add, insert the site name and the URL then click to save.

In order to use the Email icon:

Insert the icon name and on the URL write mailto: before your email address.

Like that: mailto:hello@thebasicpage.com

Replace hello@thebasicpage.com with your own email and save the link.

4. Save the gadget when you are done.

3. Slider

In order to display a post on the slider, you need to label it as slider.

If your slider does not seem to be working:

- the widget doesn't work if the blog is set to private.

- make sure you have posts labeled as slider (all in lowercase letters!).

- make sure your blog feed is set to "Full" or "Until Jump Break" (Settings >> Site feed >> Allow Blog Feed).

4. Pagination, Read more button and date format

1. Find the BLOG POSTS GADGET and click to edit it.

2. Set the number of posts on main page to 5. Don't use another number.

3. If you want to, change the "read more" button text.

4. Set the date header format according to your preference.

5. When you are done, save the changes.

5. Instagram

1. In order to use the Instagram gadget you need to create an account on PPI Loader. Register your own email here.

2. After registering, you will be sent a login link via email.

3. Log in to your Instagram account.

4. Check your email and click on the log in link.

5. Allow the gadget to use your profile information and media.

6. That's it! Your account is set.

7. Now go the LAYOUT section, find the INSTAGRAM gadget and click on the pencil.

8. Below "Content", insert your Instagram username.

9. Save the gadget.

6. Twitter

1. Find the TWITTER gadget and click on the pencil.

2. Below "Content", insert your Twitter username.

3. Save the gadget.

7. HTTPS

1. Go to the SETTINGS section of your blog.

2. Find the HTTPS configuration and make sure that both HTTPS Availability and HTTPS Redirect are ON.

(If you don't use a custom domain, only the HTTPS Redirect will appear for you.)

8. Contact page

1. Go to the PAGES section.

2. Find the + NEW PAGE button and click on it.

3. Type the title you want to name the page.

4. Click on the pencil to the left.

5. Click on HTML VIEW.

6. Delete anything that may appear in the code area. Make sure that it is blank.

7. Copy the following code:

<div id="formcontact"><form name='contact-form'><div id="formtitle"> Name </div><input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='60' autocomplete='off' type='text' value=''/> <div id="formtitle"> Email </div><input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' autocomplete='off' size='60' type='text' value=''/> <div id="formtitle"> Message </div><textarea class='contact-form-email-message' id='ContactForm1_contact-form-email-message' name='email-message' rows='10'></textarea><p></p><input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' autocomplete='off' type='button' value=' Send '/><div style='text-align: center; width: 100%'><p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p><p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p></div></form></div>

8. Paste the code in the HTML area.

9. If you want to, you can change "name", "email", "message" and "send" to your language.
Just replace the names and make sure to not erase or modify anything else in the code.

10. Publish the page.

That's it!

Well, it was a pleasure guiding you! If you have any problem or question about the installation, feel free to contact me via email at: hello@thebasicpage.com

Gabriela
The Basic Page