Home/ Search results for 'add classes'

Search results for: add classes

103 results found.

  • Creating specialized blocks

    The Pinegrow Web Editor makes creating Gutenberg blocks easy! However, some blocks have dynamic content or styling that requires some work-arounds to use as a block. In this tutorial we will explore how to add a JavaScript-powered Bootstrap carousel to our custom theme.

  • Nested blocks and class toggles

    The Pinegrow Web Editor makes creating nested blocks (blocks within blocks) easy! In this tutorial we will look at how, plus we will look at other customizations you can add to your themes.

  • Tailwind CSS Design panel

    The Pinegrow Design panel for the Tailwind CSS framework allows you to easily set up a custom theme without editing any config file or setting up a complex compiler. It also allows you to test alternative designs for your whole project quickly and easily.

  • Implementing user controls in Pinegrow

    Accessibility controls are important in web design. This tutorial walks through one method to add controls to your navbar and gives a review of CSS Grid.

  • Creating the first block

    We will use custom WordPress blocks to create a versatile and fully customizable front page for our website.

  • FAQ

    Although we try to provide as much information as possible on our website, it appears that many questions regularly come up on the community forum or in the support mailbox. We thought it might be a good idea to gather all these frequently asked questions and our answers in one place.

  • Element Properties

    Use Element properties panel to edit element’s attributes. For example, to edit classes of any element, or to change source and alt text attributes of an image. The panel also contains controls for properties defined by frameworks like Bootstrap.

  • Quick Introduction to the Pinegrow Web Editor

    The Pinegrow Web Editor is a powerful tool, but it can also be a bit daunting. This tutorial will provide a quick walk-through of the main features of Pinegrow that will let you start designing you web project quickly!

  • Dynamic Blocks

    In addition to normal JavaScript blocks, the Pinegrow Web Editor also offers dynamic PHP blocks. In this tutorial we will look at how to add these powerful blocks to your custom theme!

  • Editable areas

    Editable areas are used in both Master pages and Smart components. They are layout elements that can be customized on content pages and in component instances. Different aspects of elements can be defined as editable: the content, attributes, and classes.

  • Tailwind CSS Floating Tools

    The Floating Tools panel allows you to style your Tailwind CSS page with many of the common classes directly within the Page View, speeding up page construction and design implementation. No more switching between the page and the Properties or Style Panel. Let’s explore just what this tool allows you to do!

  • Pinegrow WordPress Starter Theme 2 documentation

    If you want to create your own WordPress theme with Pinegrow PRO/WP but you do not yet have all the necessary knowledge OR if you simply want to optimize your process and start from a solid foundation and focus on the essentials, using the ST2 is the best opportunity to get started quickly and efficiently.

  • Bootstrap Floating Tools

    The Floating Tools panel allows you to style your Bootstrap page with many of the common classes directly within the Page View, speeding up page construction and design implementation. No more switching between the page and the Properties or Style Panel. Let’s explore just what this tool allows you to do!

  • Components

    Smart components are reusable website elements that can have editable areas. Go through this article to learn about everything you can do with them.

  • Show Posts

    Show Posts action loops through a collection of posts. Post smart actions can then be used on and inside the Show Posts element to display post content.

  • Creating custom page dividers in Pinegrow

    CSS dividers help with sectioning your content both making your pages more readable, but also enhancing the visual appeal. This tutorial shows how easy it is to add custom page dividers in Pinegrow.

  • Class styles

    Tailwind Visual Editor comes with a powerful feature that makes working with Tailwind styles even easier – Class Styles.

  • Introduction to Tailwind CSS

    Tailwind CSS is a CSS framework that defines 1000s of CSS classes that are used to replace working with CSS rules and properties directly.

  • Class Tree inspector

    Visual controls for Tailwind CSS are nice, but for more experienced users working with them requires too much clicking and scrolling around.

  • Styling with CSS

    Styling – painting and positioning elements – is done with CSS properties and rules. Pinegrow offers a collection of powerful styling tools to suit different tasks and workflows.

  • Post Breadcrumbs

    Post Breadcrumbs displays the hierarchical path to the current post, either with links to post parents or with links to post categories.

  • Hybrid Blocks

    The missing piece to making custom Gutenberg blocks useful in real-world projects.

  • Working with Selectors

    Pinegrow Theme Converter uses CSS selectors to add WordPress actions to HTML elements on the page.

    Let’s take a look how to use high-quality selectors and solve any issues that might arise.

  • Release 1.107, April 23 2014

    New Pinegrow Web Designer 1.107 is available for download on pinegrow.com with many improvements that will make your work with Pinegrow quicker and more reliable.

  • Pinegrow AI Assistant

    Meet your new web development assistant. It knows how to create and transform HTML code, how to manipulate content, come up with CSS styling, make the code accessible, give advice and much more.

  • NEW: Bootstrap Blocks

    Use the new Bootstrap Blocks library and a simple three step process to easily create uniquely designed websites.

  • Journeying to improved profitability with Pinegrow 

    I’m Tim Bowerbank, Director, www.pendigital.co.uk and I am a recently converted advocate of Pinegrow. I have been using Pinegrow for 18 months now. It’s transformed our web development business into a more productive, and hence, profitable venture. I want to tell you about our journey to improved profit with Pinegrow.

  • Interactions

    Use the Interactions action to add one or more interactions to the selected element.

  • Visual controls

    Visual controls are the core of Tailwind Visual Editor. They are located in the Properties panel.

  • Release 2.1 – May 26. 2015

    Pinegrow 2.1 with Page tabs, WP goodies and more Hi, Matjaz here, the author of Pinegrow Web Editor. Pinegrow 2.1 is available for download. The update is free if it falls within one year from your license purchase (no problem if that’s not the case – you can get additional year of updates for half

  • Pinegrow CMS for static HTML websites

    No code on the server. No API calls. No generators. Just HTML.
    Pinegrow CMS lets end-users edit static HTML websites without touching the HTML code.

  • Release – 1.2 BETA

    Beta release of Pinegrow Web Designer 1.2 is available for download on http://pinegrow.com, featuring: – Working with HTML pages that use JavaScript code and plugins – Better Edit code – Visual page synchronization – Support for Revolution Slider and Bootstrap Carousel – Bug fixes At the first glance Pinegrow 1.2 looks very similar to previous releases.

  • Block Attributes

    Block Attributes action defines and uses one or more editable block attributes on the selected HTML element.

  • Pinegrow Web Editor 6.1 – July 28, 2021

    Design panel with improved backgrounds, filters, harmonic colors and local web fonts – New templates and blocks – SVG icons for every project – Code editor with intelisense, new color themes and better performance – Bootstrap and Tailwind CSS updates – and more!

  • Master Pages

    Master pages are a feature that enable you to define common structure and interface markup elements for your Web site, including headers, footers, style definitions, or navigation bars.

  • Post Excerpt

    Post Excerpt action displays the excerpt of the current post. If excerpt is not set, WordPress generates a snippet from the post content.

  • Galleries

    Learn how to use galleries blueprints to create custom image galleries.

  • Presentations

    Learn about using the presentation blueprint to create custom presentations.

  • Sliders

    Learn about using the slider blueprint to create custom sliders.

  • The Bright Bridge

    A free elegant custom Bootstrap 5 and Tailwind CSS theme and website template created with the Design panel in Pinegrow 6.

  • Release 2.2 – Jul 23. 2015

    Pinegrow 2.2 with Bootstrap & WordPress Blocks (and more) In this release: ▪ Blocks for Bootstrap and WordPress ▪ Full support for WordPress Customizer ▪ Online course about creating WordPress themes with Pinegrow ▪ Pinegrow Slack Community ▪ and more. Download Pinegrow for Mac, Windows and Linux — Bootstrap & WordPress Blocks The biggest news

  • Bootstrap Visual Editor

    No more guessing the correct Bootstrap class name and copy-pasting code from Bootstrap docs. Pinegrow includes everything you need to easily work with Bootstrap-based projects.

  • The approach

    Shop Builder is designed to give you full control over your WooCommerce projects, while at the same time, it follows the recommended customization practices and can be used alongside customizations implemented with code.

  • A guide to WordPress templates for posts, pages and custom post types

    A website usually contains more than an index page and you probably want to create different layouts for different pages and posts for your WordPress theme. The good news is that WordPress can handle all your needs thanks to the use of specific templates that you can create with Pinegrow.

  • Troubleshooting

    Because the conversion from HTML to WordPress is not a black box process, there are sometimes edge cases that you will need to take into consideration upfront in order to ensure the successful conversion of your HTML template into a fully functional WordPress theme.

  • 5 Essential Tips to Make Your WordPress Theme Project a Success

    A well thought out and well prepared WordPress project is a successful project.

    There are many different situations in which you may want to create a WordPress theme. The following tips are specifically for users who wish to use Pinegrow or Pinegrow Theme Converter to create a theme for their own site.

  • Site logo

    Display the site logo that is set in the customizer Site identity section.

  • Pinegrow at the WP Builders Fight Club

    Pinegrow participated in the WP Builders Fight Club challenge to build the same website with a bunch of different WordPress tools, and to compare results.

  • Color the Boxes

    The Pinegrow Challenge: take any tool you like – including coding by hand – and try to be faster than Pinegrow at using classes to style a bunch of boxes.

  • Introducing Pinegrow 5

    Pinegrow 5 is available for download. It comes with “Focus on…” mode, Handling inline styles and other styling improvements, Drag files from the Project panel and more.

  • Pinegrow 5 – Nov 20, 2018

    “Focus on…” mode, Handling inline styles and other styling improvements, Drag files from the Project panel and more.

  • Release 1.11 – May 29, 2014

    Lots of goodies in this release! The most important is support for defining custom responsive breakpoints together with the media query selection tool. This works on any HTML page, regardless of which framework it is using (or not). See it in action and learn how to use Pinegrow to create responsive sites. Multi-page editing was

  • Developers

    API documentation for extending Pinegrow Web Editor with custom plugins.

  • Post Featured Image

    Post Featured Image action shows the featured image of the current post, or the post itself if the post is an image attachment.

  • Pico CSS

    Customize Pico CSS with SASS in Pinegrow.