Theme Redone is a custom WordPress theme starter/framework with its own Gutenberg blocks solution and a CLI that speeds up the block creation process.

Overview

Theme Redone Gutenberg WordPress Framework

Theme Redone

The Framework for Developing Custom WordPress Themes

with its own Gutenberg Blocks creation solution.


Custom WordPress Theme Starter (framework) 2022 - Theme Redone | WebRedone

Theme Redone is a custom WordPress theme starter/framework with its own Gutenberg blocks solution and a CLI that speeds up the block creation process.

It consists of:

  • Latte templating engine for its beautiful syntax and a more streamlined and manageable workflow
  • EsBuild/Webpack + Gulp task tasks for compiling SCSS and JS
  • SCSS (SMACSS folder/files structure)
  • Javascript (ES8 and React/Svelte/Vue support, thanks to EsBuild and Babel)
  • In-theme framework for building Gutenberg blocks in a streamlined and standardized way
  • TRB CLI helper for scaffolding new Gutenberg blocks
  • Bare-bones grid system coded with Flex and CSS variables (about 15 lines of code)
  • Helper functions for repetitive tasks such as rendering images, links, SVG code, and more
  • Just a few well-written UI components to get you started (we don’t like bloat in our code): Modal, Accordion, Tabs, Menu, Dropdowns, Sliders, and simple “in view fade-in transitions”
  • SVG support
  • Tracy Debugger to help us make sure we write stable and error-free code
  • And much more

Visit https://webredone.com/theme-redone/ to learn more from our 50+ pages long docummentation.


Environment Requirements:

  • PHP 7.4.29^
  • Composer 2.0.2^
  • Node 14.19.1

Installation:

  1. Download and install/activate the latest version of the theme
  2. At the root of the theme, there is a “theme_redone_global_config.json” file. Replace “localhost:3000/theme-redone” with the name of your project from htdocs “localhost/[PROJECT-FOLDER-NAME]” (This makes sure browser-sync connects to the correct project)
  3. From the terminal (from inside the root directory of the theme) run composer install and afterward npm install to install the PHP and JS dependencies. (Make sure Node version 14.19.1 is used. We suggest using NVM to manage Node versions)
  4. Install the TRB CLI package globally ( npm i -g @webredone/trb-cli ) to scaffold blocks faster.

Compilation/Watching and Bundling/Minification Tasks:

  • To start the compiler and make it watch for file changes, simply run the npm start command from the terminal
  • Once the project is finished and ready to be deployed, run npm run build:prod to optimize css and javascript files.
You might also like...

A set of scripts to test markdown processing speeds in various site generators/frameworks

bench-framework-markdown A set of scripts to test markdown processing speeds in various site generators/frameworks. Read the blog post: Which Generato

Nov 3, 2022

coc-pyright-tools is a coc-extension that adds its own functionality to coc-pyright for coc.nvim. Currently the "Inlay Hints", "CodeLens" and "Test Framework commands" feature is available.

coc-pyright-tools !!WARNING!! Inlay hints feature of coc-pyright-tools, have been ported to coc-pyright itself. https://github.com/fannheyward/coc-pyr

Aug 23, 2022

A block preview that directly displays the block fields, including tabs.

A block preview that directly displays the block fields, including tabs.

Kirby Block Preview Fields This plugin for Kirby 3 displays the block fields directly in the block preview, including tabs. Inspired by the Kirby Fiel

May 10, 2023

⚡️ CLI building blocks & framework for the TypeScript era.

molt A set of packages related to building CLIs. Alpha maturity. Each package has its own docs. 📛 Package Path Description Use Case 🌲 molt packages/

Jan 6, 2023

This extensions adds blocks to help you create your own carnival games in MakeCode Arcade using throwable balls, extra timer functions, and extra game-over options.

Usage This extensions adds blocks to help you create your own carnival games in MakeCode Arcade using throwable balls, extra timer functions, and extr

Nov 16, 2022

It's a repository to studies. Its idea is to learn about Nx and its plugins.

It's a repository to studies. Its idea is to learn about Nx and its plugins.

StudyingNx This project was generated using Nx. 🔎 Smart, Fast and Extensible Build System Adding capabilities to your workspace Nx supports many plug

May 13, 2022

A Simplized Wordpress Blog Theme Design & Developed from 2broear.com by 2BROEAR Released & openSourced in 2022.

A Simplized Wordpress Blog Theme Design & Developed from 2broear.com by 2BROEAR Released & openSourced in 2022.

2BLOG THEME A Simplized Wordpress Blog Theme Design & Developed from 2broear.com by 2BROEAR Released & openSourced in 2022. Preview Site :演示站点 (演示并不代表

Dec 8, 2022

Can see everything, beware of its omniscience, kneel before its greatness.

Can see everything, beware of its omniscience, kneel before its greatness.

Can see everything, beware of its omniscience, kneel before its greatness. Summary Presentation Installation Removing Credits Presentation Main goal T

Sep 30, 2022

My XFCE dotties - The GTK theme as well as the kvantume theme used here are forks of the Matcha GTK/kvantum theme

My XFCE dotties - The GTK theme as well as the kvantume theme used here are forks of the Matcha GTK/kvantum theme

DOTFILES OF MY XFCE SETUP The GTK theme as well as the kvantume theme used here

Dec 31, 2022
Comments
  • Update Installation instructions

    Update Installation instructions

    1. Download and install/activate the latest version of the theme

    You can't activate the theme at this point. Without running composer and npm install, the vendor and views directory don't exist. If you try to activate at this point you'll get an error.

    New instructions:

    1. Download and install the latest version of the theme
    2. At the root of the theme, there is a “theme_redone_global_config.json” file. Replace “localhost:3000/theme-redone” with the name of your project from htdocs “localhost/[PROJECT-FOLDER-NAME]” (This makes sure browser-sync connects to the correct project)
    3. From the terminal (from inside the root directory of the theme) run composer install and afterward npm install to install the PHP and JS dependencies. (Make sure Node version 14.19.1 is used. We suggest using NVM to manage Node versions) Install the TRB CLI package globally ( npm i -g @webredone/trb-cli ) to scaffold blocks faster.
    4. In WordPress, activate the theme
    opened by zocoloco 1
  • Error after install

    Error after install

    Hi,

    Installed theme in Local , followed instructions from site (and closed issue) but still getting error.

    Vendor directory is not created. Views directory is created.

    Server started just fine.

    Please check SS for details https://prnt.sc/-94W7mnliBnp

    Maybe I`m missing something

    opened by igorsamardzija 4
  • A friendlier way to return social media names

    A friendlier way to return social media names

    https://github.com/webredone/theme-redone/blob/2da961b696559f64a2c56ef71def156767e05652/php-inc/theme-functions.php#L514

    Writing this function this way allows for social media links to inherit the TLD instead of filtering from an opinionated list.

    function tr_get_soc_name($soc_media_link) {
    	$soc_media_name = parse_url($soc_media_link, PHP_URL_HOST);
    	$domains = explode('.', $soc_media_name);
    
    	return $domains[count($domains) - 2];
    }
    
    opened by alifeinbinary 2
Releases(v1.1.0)
  • v1.1.0(Nov 26, 2022)

    Minimum required PHP version changed to ^8.0

    • Along with this change. Latte has been upgraded to version: 3.0.3, and Tracy Debugger to version: 2.9.4
    • Fixed bugs caused by PHP version upgrade
    • With PHP v8.0, we now have support for named arguments

    tr_get_media() function, when called synchronously, now prints only the image, without the 2 wrapper divs that are actually needed only for the async call, to prevent the CLS and calculate the space required for the image that would be loaded asynchronously.


    TrRepeater component now has a new feature that enables its nested elements to be represented in a grid in the admin. The same way as the root attributes' fields grid works (the only difference is that when setting up the grid, the property name in the repeater's field_meta object is called fields_grid, and not grid ). (Up until now, only the repeater_items could be represented as a grid, but with this update, each 'repeater_item`'s child element can be represented as part of the grid). Note that this only works for the first-level repeaters.

    • With this update, the example repeater-fields-grid block has been created, and we can see this feature used on the breadcrumbs repeater fields of this block.

    Previously deregistered WP core blocks, their CSS and other de-registers, and CSS overwrites have now been removed, and all the WP CORE blocks can now be used by default.

    Source code(tar.gz)
    Source code(zip)
  • v1.0.2(Sep 18, 2022)

    Added support for the _slider.latte component to accept an instance of the WP_Query as the alternative to the array.

    Note that when using the slider component with the WP_Query, the "slide_q" block is used as opposed to the "slide" block, which is used with regular arrays

    Added the "after_loop" block as well, which can be used to insert the pagination, for example.

    Can be used like this for example:

    {var $posts_query = new WP_Query(
      array(
        'post_type' => 'post',
        'posts_per_page' => 6,
        'orderby' => 'DESC',
      )
    )}
    
    {embed 
      tr_part('_slider'), 
      class: 'slider--test', 
      slides: $posts_query
    }
      {block slide_q}
        <div style="box-shadow: 0 0 0 1px blue">
          <h5>{the_title()}</h5>
        </div>
      {/block}
    
      {block after_loop}
        <div style="padding: 10px; box-shadow: 0 0 0 1px orange;">
          <strong>pagination can be added here</strong>
        </div>
      {/block}
    {/embed}
    
    Source code(tar.gz)
    Source code(zip)
  • v1.0.1(Sep 2, 2022)

Custom Gutenburg blocks to add custom functionalities to your WordPress site. Brought to you by Arif Khan with <3

Gutpress(WordPress Gutenburg Block Plugin) Custom Gutenburg blocks to add custom functionalities to your WordPress site. Brought to you by Arif Khan w

Arif Khan 4 Nov 23, 2022
Deploy WordPress plugin and theme to the wordpress.org plugin directory.

wp-deployer Deploy WordPress plugin and theme to the wordpress.org plugin directory. Install npm install --save-dev wp-deployer Settings slug : Plugin

Nilambar Sharma 5 Sep 6, 2022
🌗 1 line of code to apply auto dark / light theme and support custom theme for your website. Super fast and lightweight theme library.

themes.js A super lightweight and fast Theme library with auto system color scheme detection in JavaScript. Features Auto detect Dark / Light mode by

SerKo 4 Nov 29, 2022
Allow moving/copying/and creation embeds for blocks with drag-n-drop just like Logseq or Roam

Demo Features Drag-n-drop for list items in the same pane and between different panes 3 modes: move block, copy block, embed block Automatic reference

null 92 Dec 26, 2022
An experimental plugin to preview and insert block patterns in WordPress.

Block Pattern Explorer The Block Pattern Explorer is an experimental WordPress plugin based heavily on the work currently being done in Gutenberg. The

WP Engine 16 Oct 19, 2022
Integrate Tailwind with the @wordpress/create-block script.

Tailwind Blocks Example plugin demonstrating how to integrate Tailwind with the @wordpress/create-block script. The plugin was scaffolded using @wordp

David Gwyer 25 Nov 13, 2022
Node-cli-starter - Basic starter kit for building Node CLI applications with TypeScript.

node-cli-starter Minimal starter kit for building Node CLI applications with TypeScript. Getting Started To get started clone repo locally and run npm

Cory Rylan 7 May 17, 2022
A plugin that uses multiple block, Tailwind and is fully integrated into the standard build process

Tailwind CSS Custom Block Plugin This repo leverages the @wordpress/scripts package and it's ability to use PostCSS to introduce TailwindCSS to the bu

Ryan Welcher 3 Dec 31, 2022
Gutenberg + Rust + TypeScript

Gutenberg + Rust + TypeScript This is a minimum block plugin template to rapidly get started building WP blocks using Rust + TypeScript. Follow me on

Kevin Batdorf 29 Dec 23, 2022