Git Product home page Git Product logo

webflow-git's Introduction

Webflow Git

A utility to track changes to a Webflow site on GitHub.

Introduction

Webflow Git is a simple utility used to monitor and track changes to a Webflow site on GitHub. Both style and content changes are detected and every change is stored as a GitHub commit.

The utility is simple to set up because it doesn't require access to your Webflow account and all customization can be done via the GitHub web interface.

Installation

  1. Log-in or create a GitHub account.

  2. Click the "Use this template" button above the code to generate a new repository based on this template repository:

Use this template

Please note that creating a repository from a template is different from creating a fork. Fork only if you plan to experiment with the code and contribute your changes back to this repository. Here you can find more information about using templates.

  1. Name your new repository the same as your Webflow site domain (e.g. www.example.com). Alternatively, you can choose any repository name and specify the site domain in the configuration file:

Repository name

Configuration

You can customize Webflow Git by editing the webflowgit.yml configuration file. To achieve this, open the file contents and click on the Pen icon:

Edit configuration

Make sure to test your changes by triggering the check manually.

site

Specify URL of the site to be monitored, including the protocol, e.g.:

site: https://www.example.com

Disable tracking completely:

site: false

By default, the site domain is the same as your repository name.

pages

Do not track changes in pages content (track style changes only):

pages: false

Ignore changes in some pages (for example CMS-generated pages, like blog posts or product pages). This setting uses glob syntax:

pages:
  ignore:
  - /posts/**

By default, all pages are tracked.

How it works

The utility works by visiting your site at regular intervals and downloading, formatting and comparing the code to the previous revision. If any difference is detected, a new revision is committed to the repository.

Check frequency

Your site is checked for updates every hour.

Advanced: this can be customized by updating the cron schedule in the workflow configuration file.

Manual trigger

You can launch the check manually. To achieve this, click the Actions link on the menu below your project name, then select webflow-git workflow and finally click on the "Run workflow" button:

Trigger manually

Epilogue

This project was created out of frustration with random regressions in Webflow projects. Although there's a built-in backup functionality, it's time-consuming to find out at which point something has broken down, and then, due to the lack of diff functionality, it's very difficult to understand the nature of the modification that caused the regression. The problem becomes even more severe if multiple people develop the same project.

Some parts of this tool are inspired by an excellent Upptime site monitor, most notably using the GitHub Template and configuration management.

webflowgitbyloomchild

webflow-git's People

Contributors

loomchild avatar

Stargazers

Felix avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.