Giter Club home page Giter Club logo

gridable's Introduction

Gridable

The Missed Grid Content Editor


Remove gridable style?

Gridable adds some CSS style in front-end to handle the grid, but if you want to use your grid system or something like Bootstrap you may want to disable this behavior by using this filter:

add_filter('gridable_load_public_style' '__return_false' );

Note: We may add an option for this feature, but this filter will always have the last say!

Row and Column templates

Each row is represented by the [row][/row] shortcode and be sure that there is a template file which can be found in gridable/public/partials/row.php.

You may overwrite this file in your theme in template-parts/gridable/row.php with your markup, but this is highly NOT recommended, only for desperate cases.

The right way would be to use the actions and filters available.

  • gridable_before_row_render and gridable_before_after_render - action - You can use them to add an extra wrapper

  • <div class="row" > - gridable_row_class - filter

  • <div class="row" data-custom-attribute="value" > - gridable_row_attributes - filter - Did you know you can add custom attributes?

  • gridable_before_row_content_render and gridable_after_row_content_render - action - You can use them to add an inner wrapper

  • gridable_render_shortcodes_in_row - filter - You can chose NOT to run inner shortcodes since they run by default

  • gridable_the_row_content - filter - In case you need to filter the content of a specific row

Need some grid attributes?

This plugin adds a nice interface to edit row or column custom attributes

<script src="https://gist.github.com/andreilupu/2ed88a589ece14a8a8afdb1170db9e43.js"></script>

gridable's People

Contributors

burloiucosmin avatar cristianfrumusanu avatar genietim avatar razwan avatar vladolaru avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

gridable's Issues

Improve Resizing UX

  • Sa oferim optiune sa faca resize la coloana din 1 in 1, nu din 2 in 2 cum e acum. Tinand cont ca poate sa adauge mai multe coloane si sa le foloseasca in fel si chip (eg. doar pentru spatiere)
  • cursorul pe bara de resize, la hover, ar trebui sa fie col-resize
  • la click/drag ar trebui sa se schimbe in move

Test with Two Editors

De exemplu avem editorul principal si cel de Hero Area sau cel de Description de la Rosa.

Gridable Options Impossible to Change

Testam pagina de meniu de la Osteria si voiam sa modific niste Spacing-uri, dar apare asa:

Par sa fie niste input-uri si checkbox-uri cand incerc sa modific chestii pe acolo (desi stiu ca acolo ar trebui sa fie dropdown-uri).

Am luat Gridable de pe branch-ul dev.

Change Plugin Name

Sa schimbam din Griddable in:

Gridable - The Missing Grid Content Editor

Limit Selection in Column

Atunci cand vreau sa adaug continut nou intr-o coloana si vreau sa il sterg pe celalalt se intampla cam asa:

Cand selectez tot continutul (nu neaparat cu Cmd+A, ci o simpla selectie cap-coada) si apoi dau Cmd+Shift+V, continutul nou se duce intre coloane.

Cand sterg continutul litera cu litera si apoi dau Cmd+Shift+V coninutul sta in coloana in care am vrut sa il pun.

https://cl.ly/1t3n1j3H1I1A

Selecting All Content with Triple-Click Weird Behaviour

Poate ii extrem, dar am tendinta sa fac asta foarte des.

Comportamentul default al browser-ului e ca atunci cand dai dublu-click intr-un paragraf, intai sa selecteze doar acel cuvant din paragraf in care te afli cu cursorul. La triple-click se selecteaza tot continutul dintr-o sectiune.

Pornind de la asta am facut si inregistrarea de mai jos. Prima oara selectez un cuvant din coloana cu double-click si dau paste la un text acolo si este inserat cum trebuie. Problema apare cand dau triple-click ca sa inlocuiesc tot continutul. Pare sa selecteze ceva in plus (un whitespace?), iar apoi textul pe care vreau sa il inserez mi-l pune la inceputul continutului postarii.

https://cl.ly/3E1j3s2t1X2B

Daca e sa selectez textul de la un capat in altul, nu cu triple-click si avand grija sa nu iau vreun whitespace in plus, inserarea unui text nou functioneaza bine.

De specificat ca sunt pe Noah (local, v. 1.1.2), testez varianta basic de Gridable.

Background Color Doesn't Have Wanted Effect

Aici https://pixelgrade.com/demos/osteria/events/#rooms, la partea cu The Salon am setat culorile ca sa vad mai bine cum functioneaza background color (column: rosu; row: albastru):

Totusi nu pot sa vad cum as putea obtine ceva asemanator:

Column background color se seteaza pe toate coloanele sau doar pe coloana selectata? Daca e doar pe coloana selectata, mie nu imi apare panel-ul de editare cand dau click pe coloana din dreapta, ci doar cand dau in cea din stanga.

Gridable conflict with PixCodes

Pe o instalare cu Gridable si PixCodes active ambele in acelasi timp, shortcode-ul de [row] de la Gridable este suprascris de cel de la PixCodes.

Newline Gets Erased Everytime I Update

Daca vreau sa adaug un newline inainte de un text, se pare ca mi-l ignora:
https://cl.ly/0Z1i1Q0f0s26

Vad ca acum nu prea mai insereaza &nbsp;, dar sper ca nu ii o filtrare care sa faca asta, pentru ca ar putea sa elimine spatii care ar trebui sa fac acolo. I might be wrong tho.

Content Seems to Align to Bottom

Nu stiu daca e intradevar o problema sau mi-a scapat mie ceva, dar am gasit asta:
https://cl.ly/3O2907180k0z

Am dat inspect ca sa vad daca mai exista paragrafe care sa imi faca probleme la spatieri si le-am sters din inspector si vad ca o data ce dispar, continutul coboara in jos. Ma asteptam sa ramana pe loc cel putin :/

Resize handlers not removed properly

The current removing method doesn't work.

We could try to force the cursor to move out of the grid, this way the handlers will be removed at node change.

Adding one column should share the size

The size of each column should be adaptive when someone adds or removes a column.

When there are 2 columns with 6/6 and someone adds a new column the new layout should be 4/4/4 and not 5/5/2 as it is now.

The same operation should be reverted while removing a column.

If the row is like 4/4/4, removing a column should return to a 6/6 layout.

Missing Focus on Input Fields

Cand adaug un link in interiorul coloanei imi scoate focusul de pe URL:
download

Problema pare sa fie in general cu input-urile (vezi si Titlul paginii).

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.