https://github.com/webmatch/WbmViewportResizer

Shopware-Plugin to preview the Frontend in responsive viewports
https://github.com/webmatch/WbmViewportResizer

developer-tools frontend responsive shopware shopware-plugin viewport-dimensions

Last synced: 3 months ago
JSON representation

Shopware-Plugin to preview the Frontend in responsive viewports

• Host: GitHub
• URL: https://github.com/webmatch/WbmViewportResizer
• Owner: webmatch
• Created: 2017-02-23T13:37:13.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2017-03-08T13:58:05.000Z (over 7 years ago)
• Last Synced: 2024-04-30T08:41:28.207Z (6 months ago)
• Topics: developer-tools, frontend, responsive, shopware, shopware-plugin, viewport-dimensions
• Language: PHP
• Size: 18.6 KB
• Stars: 1
• Watchers: 9
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: readme.md

Awesome Lists containing this project

• awesome-shopware - Viewport Resizer - Shopware plugin to preview the frontend in responsive viewports. (Development Plugins)

README

        
WbmViewportResizer - preview predefined viewports

=====

[![Scrutinizer](https://scrutinizer-ci.com/g/webmatch/WbmViewportResizer/badges/quality-score.png?b=master)](https://scrutinizer-ci.com/g/webmatch/WbmViewportResizer/?branch=master)

[![Travis CI](https://travis-ci.org/webmatch/WbmViewportResizer.svg?branch=master)](https://travis-ci.org/webmatch/WbmViewportResizer)

**This plugin is meant for development purposes only**

This plugin makes use of [jResize](https://github.com/toddmotto/jResize) jquery plugin 

to present the frontend of the shop within an iframe, that can be adjusted to the width of

the various predefined viewports.

![WbmViewportResizer](https://www.webmatch.de/wp-content/uploads/2017/02/viewportresizer.png)

Requirements

-----

* Shopware >= 5.2.0

Installation

====

Clone this repository into a folder **WbmViewportResizer** within the **custom/plugins** directory of the Shopware installation.

* Install the plugin through the Plugin-Manager within the Shopware backend. 

* Activate the plugin and when prompted allow for the clearing of the listed caches.

## Install with composer

* Change to your root Installation of shopware

* Run command `composer require webmatch/wbm-viewport-resizer` and install and activate plugin with Plugin Manager 

Usage

=====

Navigate to *your-shop.tld/viewportresizer* to browse your shop through the adjustable iframe.

To navigate directly to a certain page you can use the *path*  GET parameter e.g. *?path=account/index*

Use the top menu bar to switch between viewports. The width of each viewport will be the minimal width of each viewport 

(except for the smallest mobile viewport where it is the maximal width).