OBLIQ Progressive Web Apps

OBLIQ is a Progressive Web Application built with Ionic Framework (1.x). Perfectly suited for publishers (bloggers and digital newspapers & magazines) it has an outstanding look & feel and will speed up the process of creating your next mobile application (hybrid or not). OBLIQ comes equipped with the following options:

Over 10 carefully designed views and components such as social sharing (Facebook, Twitter, Google+), commenting and integration with Google DoubleClick for Publishers.

JSON REST API that can be extended to fit your needs

Compatibility with WordPress as the back-end CMS

Push Notifications by integrating with OneSignal

Angular/Ionic & SASS Source Code

Unit Tests and End-to-End Tests with Karma, Jasmine and Protractor (50-60% code coverage)

Extensive Documentation

Check out our entire collection of progressive web app themes on PWAThemes.com: , , , , , , , , , , , , , , ,

& .

1. Open Chrome/Safari on your Android/iOS mobile device (smartphone or tablet)

2. Navigate to

3. Swipe around and enjoy!

Cross Platform

All it takes for a mobile web application to run is a modern mobile browser (HTML5 compatible), thus allowing users to instantly have access to your content, without needing to go through an app store, download & install the app.

Responsive UI

The mobile web application is sensitive to various screen sizes and orientation changes: landscape, portrait. In other words, the look and feel of the mobile web app seamlessly morphs into the screen size of users’ devices.

Theming

You can offer your users an exceptional reading experience by giving them a mobile web application with a native app-like look & feel. WP Mobile Pack PRO comes with 3 fully customizable app themes.

Customize Appearance

You can customize the colors & fonts, add your logo and graphic elements that can relate to your blog’s identity.

Sync Posts

The posts inside the mobile web application are organized into their corresponding categories, thus readers can simply swipe through articles and jump from category to category in a seamless way.

Sync Pages

Choose what pages you want to display on your mobile web application. You can edit, show/hide different pages and order them according to your needs.

Sync Comments

All the comments that are displayed in the blog are also synchronized into the mobile web application. On top of that, comments that are posted from within the app are also displayed on the blog.

Google Analytics

OBLIQ easily integrates with Google Analytics.

Google DoubleClick for Publishers

Monetization options (Google AdSense & Double Click for Publishers).

Push Notifications via OneSignal

Integration with OneSignal to enable push notifications management.

Add to Homescreen

Users can add the mobile web application to their homescreen and run it in full-screen mode.

* Full-screen cover page

* Pages & sub-pages menu

* Large hero images in the articles carousel

* Side-to-side navigation with lateral swiping

* Maximum 2 articles per pageObliq is bold. With sharp lines throughout the app, it’s best suited for an opinionated blog, one that is sure of its point of view and not afraid to show-off. Here, images are the heroes, making this theme a perfect fit for showcasing great visual content.

Cover Screen

OBLIQ’s homepage mimics a magazine cover, highlighting the latest article. There are 6 default covers which can be replaced with your own static ones. Alternatively you can choose a more dynamic approach by displaying the article’s hero image.

Main and Related Articles

Swiping the cover left will bring to light the main articles, organized by category. Mobile users can swipe left or right to expose articles and tap on the card to read more.

Navigate through

The categories section consists of a vertical list of s that’s composed of a featured image and a category title. There can be as many categories as needed, 10 of them being displayed at loading time, with the others being showed when “load-more” is fired up.

Nested Pages Menu

Pages are morphed into an app section which we entitled “More”. Its menu-like appearance makes it easy to navigate from “page” to “page” and its nested nature enables multi-level display. This is particularly useful if you’re based on WordPress CMS.

Pull-up Menu for Comments and Social Media Sharing

Commenting and sharing is directly embedded within each article’s detail page. The panels are opened by pressing the corresponding buttons from the post’s footer bar. When commenting, mobile users don’t have to be authenticated. Sharing across Facebook, Twitter and Google Plus is as seamless as it should be on any mobile device.

Here’s a brief overview of the main files that you’ll be receiving when downloading OBLIQ:

– Ionic.app.scss this is where we import the Ionic library and you can import other partials before the library to override default Ionic variables.

– Main.scss this is where we import the main application styles.

By default we separate the files we import here into three categories:

BASE – where we include utilities, such as:

* SASS functions

* Variables

* Mixins

* Typography — default styles for typography across the entire app. You can obviously override them in your components.

* Utility-classes — are classes that help quickly style your design.

COMPONENTS – where we include the default styles for components, such as the ones in Ionic’s list of CSS Components e.g. Forms, Buttons, Toggles etc.

MODULES – This is where we include styles specific to each module in your application.

In our experience working with a handful of developers over the past months, this structure has enabled us to greatly improve how we write CSS and handle our stylesheets, and we hope it will do the same to you too. More documentation available here:

If you have questions please don’t hesitate to get in touch:

Add a Comment

Your email address will not be published. Required fields are marked *

error: Content is protected !!