Posted on Leave a comment

Integrating HsBlog to Wilcity

What’s HsBlog

HsBlog is an elegant WordPress Blog, Magazine theme based on ReactJS – A JS Application created by Facebook. Take advantage of ReactJs, HsBlog brings to your readers a different experience than other themes: When clicking a link on the website, HsBlog doesn’t Have To Refresh the Browser, the data is downloaded instantly instead. SPAs are all about serving an outstanding UX by trying to imitate a “natural” environment in the browser — no page reloads, no extra wait time.

Demo: https://highspeedblog.com/

Purchase HsBlog: https://wiloke.com/product/hsblog-magazine-news-wordpress-theme-and-ios-android-app/

Integrating HsBlog to Wilcity Theme

Before you start

Before you start, make sure that the following plugins are installed and updated:

HsBlog Core

  1. Log into your Hsblog site
  2. Click on Wiloke Service
  3. Then click on Update button on HsBlog Core

Wilcity Plugins

  1. Log into your Wilcity Site
  2. Process to update the following plugins: Wilcity Shortcodes, Wilcity Elementor Addon (If you are using Elementor), Wilcity WP Bakery Addon (If you are using WP Bakery Pagebuilder)
  3. Look for Wilcity HsBlog plugin and click on Install button. Then, click on Activate button.

Integrating HsBlog Category to Wilcity Theme

Step 1: From the admin sidebar, click on Appearance -> Theme Options -> HsBlog Settings -> Enter in your HsBlog Website URL to HsBlog Base Url setting

Step 2: Click Save Changes

Step 3: Go to your Homepage -> You will see Edit Page link at the top of the page -> Click on it. Or you can click on Pages (on the Admin sidebar) -> Search for your Homepage -> Click on Edit link

Step 4: Do the following steps to add HsBlog Categories to your site (Do the same thing with Elementor and WP Bakery)

Integrating HsBlog To Wilcity App

Before you start

Before you start, You should go to ThemeForest and download latest version of Wilcity. Then you need to extract wilcity-package.zip file, You will see wilcity-app.zip – It’s latest version of Wilcity App.

Re-creating Wilcity App

Step 1: Extract wilcity-app.zip

Step 2: Open configureApp.json and add your hsblog site to baseUrl under apiHighSpeedBlog. The code should look like this:

{
    "api": {
        "baseUrl": "https://demo.wilcityapp.com/",
        "timeout": 30000
    },
    "apiHighSpeedBlog": {
        "baseUrl": "https://highspeedblog.com",
        "timeout": 30000
    },
    ...
}

Step 3: Rebuild your app.

Posted on 2 Comments

Integrating Custom Twitter Feeds to Wilcity

Thank Smash Balloon for creating an useful plugin https://wordpress.org/plugins/custom-twitter-feeds/

We got an interested question about Twitter Feed from @TokyKempen on the Wilcity Group

We absolutely can embed Twitter Feed to Wilcity, and in this tutorial, We will show up how to do it.

Step 1: Installing required plugins

  1. Logging into your Website
  2. Downloading Wilcity Custom Twitter Feeds plugin by clicking on https://www.dropbox.com/s/eoef19nanlna4yo/wilcity-custom-twitter-feed.zip?dl=0
  3. From the admin sidebar, click on Plugins -> Add New -> Install the plugin -> Activate it
  4. Click on Appearance -> Install Plugins -> Install and Activate Custom Twitter Feeds plugin

Step 2: Creating Twitter Configuration Group to Add Listing page

Clicking on Wiloke Tools -> Listing Settings -> Drag Group Field to Used Field. In the group field, You should add 5 fields with the following keys: usertimeline_text, consumer_key, cosumer_secret, access_token, access_token_secret and the group key is my_twitter_feeds

Step 3: Showing up Twitter Feeds on Single Listing page

Now, navigate to Single Navigation -> Add add new Section like this

Key: my_twitter_feeds

Content: [wilcity-custom-twitter-feeds]

And here is what you get on the Front-end

Twitter Configuration on the Front-end

Twitter Configuration in the Back-end