SmartGrid BBCode - 12er System

This site uses cookies. By continuing to browse this site, you are agreeing to our Cookie Policy.

  • SmartGrid BBCode - 12er System

    23 Aug 2015

    Hi,

    today I’ve worked on a BBcode that is intended to ensure in the future the possibility to classify a text in a better way. These systems can be already seen on websites using such grid systems to represent the content.

    What does a grid system actually do?

    A grid system divides the page into maximal 12 columns that are spreading evenly across the page. The text or the content of the box adapt accordingly. At this point it should be mentioned that I'm just not really sure how to describe it best, so I think the picture on the right hand side describes it visually very well. In developing this, I've decided on a 12 grid in order to allow for end-users to have as many opportunities as possible to represent the text.

    The grid system I’ve created will appear in 2 variants. The one variant (variant old) divides the text into sections or columns. If you want 12 columns, you insert the BBcode 12 times, if you want to use only 2 columns, use the BBcode only 2 times.

    Here’s an example:

    Display Spoiler

    Source Code

    1. [smartgrid=old][sg=2] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.[/sg][sg=2] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.[/sg][/smartgrid]
    2. [smartgrid=old][sg=4] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.[/sg][sg=4] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.[/sg][sg=4] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.[/sg][sg=4] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.[/sg][/smartgrid]







    The second variant (variant new, active by default!) uses a slightly different system. Here, the figures of the SG in the SMARTGRID must amount to 12 at the end. An example: In the smartgrid the following data are given sg = 2; SG = 3; sg = 4; sg = 3; then this results at the end in the number 12, if you’re adding up all the numbers. With this method your ability to customize your text is even more increased.

    Here’s an example:

    Display Spoiler

    Source Code

    1. [smartgrid=second][sg=2][sbox=rot]Lorem ipsum dolor sit amet, consetetur sadipscing elitr,[/sbox][/sg][sg=8]Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.[/sg][sg=2]Lorem ipsum dolor sit amet, consetetur sadipscing elitr, [/sg][/smartgrid]




    The construction of the BBcode

    • The BBcode looks like this [smartgrid] [sg = XX] text [/ sg] [/ smartgrid]
    • If you want to use the old version, just use the extra = old (namely [smartgrid = old])
    • With the the SG, you have to insert the numbers at XX; with the old system you have to give the number of the columns that you want, e.g. 4 (then you also must repeat the SG 4 times), with the new system the SG numbers in the Smartgrid have to come up to 12.



    At the end there’s again a picture of how it looks like in a concrete text:







    By the way, before anyone starts asking: I don't know when I'll be able to finish the BBcode to 100% and publish it. ;)
    Gruß
    Jonas


    Hallo – Hello – Bonjour – Merhaba – Hei - Γεια σας – Hej – مرحبا – Halo – Olá – Hallå – здраво - ¡Hola
    #welcome #refugeeswelcome #statement

    1,147 times read

Comments 0