Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Stacy Basye 19 posts 80 karma points
    Mar 06, 2015 @ 01:30
    Stacy Basye
    0

    How do I insert the grid view into my template?

    So, a little background: I'm a front-end developer who mostly does design/css/html type stuff. I'm trying to branch out right now and learn how to wire doctypes up to my templates. I've been able to teach myself how to do really basic things like render stuff from media picker and richtext editor properties (and I do this by typing simply "@CurrentPage.thepropertyalias"). I can't seem to find anywhere that walks you through how to insert a gridview property in the template, though. I understand it's probably more complicated, and probably requires the use of those partial views, but yeah, I'd really like to know. Please help me out. =3

  • mike 90 posts 258 karma points
    Mar 06, 2015 @ 01:37
    mike
    0

    Create data type then select grid view as property editor.  Then add a property to template of the data type you just created.

  • Stacy Basye 19 posts 80 karma points
    Mar 06, 2015 @ 01:40
    Stacy Basye
    0

    Oh I have created the data type. And I added the property to the doctype. I gave it the alias "content." I tried rendering it as simply @CurrentPage.content in the template.

    This is what happens on the front end when I tried doing it that way:

    { "name": "1 Column", "sections": [ { "grid": 12, "rows": [ { "name": "Full Width", "areas": [ { "grid": 12, "editors": [ "headline" ], "controls": [ { "value": "<p>Hey look at this!</p>", "editor": { "name": "Rich text editor", "alias": "rte", "view": "rte", "icon": "icon-article" } }, { "value": "Wow!", "editor": { "name": "Headline", "alias": "headline", "view": "textstring", "icon": "icon-coin", "config": { "style": "font-size: 36px; line-height: 45px; font-weight: bold", "markup": "<h1>#value#</h1>" } } } ] } ], "id": "6726c1e2-377c-f49f-a595-27527ecac19d" }, { "name": "Glossary Item", "areas": [ { "grid": 3, "controls": [ { "value": { "focalPoint": { "left": 0.5, "top": 0.5 }, "id": 1096, "image": "/media/1005/backstab.png" }, "editor": { "name": "Image", "alias": "media", "view": "media", "icon": "icon-picture" } } ] }, { "grid": 9, "controls": [ { "value": "<p>I am testing this thing!</p>", "editor": { "name": "Rich text editor", "alias": "rte", "view": "rte", "icon": "icon-article" } } ] } ], "id": "3f44e657-d4c9-a3bc-fd52-7247ca33f35a" } ] } ] }

  • mike 90 posts 258 karma points
    Mar 06, 2015 @ 01:42
    mike
    0

    Just had a quick look at the starter kit template code.  It has this:

    @CurrentPage.GetGridHtml("content""fanoe")
    

    I guess one is name of property and one is name of the grid type.

  • Stacy Basye 19 posts 80 karma points
    Mar 06, 2015 @ 01:46
    Stacy Basye
    0

    Ooh. Well what is the "grid type"? Is that what I named my data type that used the grid layout property editor?

  • mike 90 posts 258 karma points
    Mar 06, 2015 @ 01:56
    mike
    101

    Turns out the second parameter is if you have setup a custom grid template for instance if you wanted different bootstrap version or an alternative library to bootstrap.

    Just using this should be fine.

    @CurrentPage.GetGridHtml("content")
  • Stacy Basye 19 posts 80 karma points
    Mar 06, 2015 @ 01:57
    Stacy Basye
    1

    I googled that @CurrentPage.GetGridHtml and it seems I can render it as this:

     

    @CurrentPage.GetGridHtml("propertyalias")

     

    No comma. I think if you add in the comma, the second word would be to override the bootstrap. Thanks for your help!! =)

     

    Edit: Oh I guess we were typing at the same time... thanks again. ;-)

Please Sign in or register to post replies

Write your reply to:

Draft