Copied to clipboard

Flag this post as spam?

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


  • Wolfie 25 posts 141 karma points
    Mar 06, 2017 @ 20:22
    Wolfie
    0

    Creating New Page Element

    I was looking at trying to create a new page element.

    I created a new document type. I even copied the Statement Section document type.

    I tried creating a template. Even made a partial named similar to yours.

    And I added it to the Sections Folder children.

    I can create the element on the page and enter content.

    But, this is where I am stuck. I am obviously missing something to connect this to the output. Nothing in either template nor partial shows on the page for either the new element I created nor the one I copied.

    Could someone post a quick 1.2.3 step procedure to creating a new page element please?

  • Sotiris Filippidis 286 posts 1501 karma points
    Mar 06, 2017 @ 20:24
    Sotiris Filippidis
    100

    I think what you missed is that you have to edit the PageSectionRenderer partial to add rendering for your new section (essentially calling the new partial when this section is used). Other than that, I think the rest of the steps are what you already have done.

  • Wolfie 25 posts 141 karma points
    Mar 10, 2017 @ 21:23
    Wolfie
    0

    That was it. Thank you.

    I see there is a stand alone page for the portfolio image. Is there a way to create a similar page for the image gallery as well?

    Reason being is that I am adapting the image gallery to detect and include 360 degree pano images which I have accomplished. It, for now, launches the default iframe html file from google VR. What I would like ultimately is to be able to have a page under umbraco that would receive the landing rather than the default one supplied by google.

    As I said, I have the pieces in place to render the image thumb and alter the link/url as well as even doing an overlay on the thumb indicating its a 360. Here is the page thus far:

    http://www.wolfiesden.com/personal-photos/

    Standard images render as normal. However if a checkbox is ticked when the photo is added to the gallery, its marked as a pano and the thumb box is rendered slightly different with a different link that breaks it out of the lightbox system so it can send it to the 360 pano renderer.

    What I would like to have happen is similar to the portfolio widget: http://www.wolfiesden.com/portfolio/

    In that the image actually has a landing page with some contextual content (notes and such) but not as elaborate as the portfolio.

    Here is how I would like it to look or function (obviously a standard page that I have used as a mockup):

    http://www.wolfiesden.com/pano-test/

    I just haven't a clue how I would create a landing page that would have the single image model. I am hoping that this can be done without Visual Studio and re-compiling. Any pointers would be, again, greatly appreciated.

  • Sotiris Filippidis 286 posts 1501 karma points
    Mar 12, 2017 @ 14:27
    Sotiris Filippidis
    0

    Well, what you're asking for, although very reasonable, involves quite a bit of development. Image galleries do not have a separate page for images, so you would have to create one. You could either have the dImageGalleryItem doctype composed with the AbstractPage and AbstractOpenGraph doctypes and create a template for it, or copy to a new doctype and actually use both - with significant changes in code.

    In short, it's not a very easy task since it includes a lot of steps. Recompiling is not really necessary, since most of the code (at least in this version) resides in App_Code, and only reusable stuff are included as compiled code.

  • Wolfie 25 posts 141 karma points
    Mar 13, 2017 @ 19:32
    Wolfie
    0

    Unfortunately, I was not seeing any controller for the image gallery in that folder. I had found the folder earlier but without some form of controller reference its hard to make progress.

    The last thing I wanted to do was have to create a new page for each image. I wanted to be able to pull the data in a template but I don't have any example code from which to draw on for an example.

    Most of my projects are pre-compiled. I, unfortunately, don't have much experience in a free compile environment like Umbraco. I am used to seeing object definitions and source. So its kind of blinding working without them.

    What I think I needed to do was create a controller that can query the database to populate a DImageGalleryItem model and subsequently pass that to a template/partial. But thats where I am stuck.

    Maybe I will look into the ColorBox and see if I can extend it since I have the image data on the image gallery page.

  • Wolfie 25 posts 141 karma points
    Mar 13, 2017 @ 19:53
    Wolfie
    0

    Ahh! I got it my friend. At least mostly. I wish there was a way to output JS to the head and end of body from within a partial though.

    Barring any ability to output to the section before end of page body, I added this to the area at the bottom of the siteTemplate:

    <script>
        $(document).ready(function(){
            $(".cbox-gallary360").colorbox({iframe:true, width:"90%", height:"90%"});
        });
    </script>
    

    I added it between the RenderJSHere and the Raw output from the config figuring that the config should really be last so as to offer a last chance to alter the default results.

    Then I output the proper class to the 360 images in the SectionImageGallery partial.

    The only downside is the forward/next doesn't go into 360 images from regular photos. But I don't know any other way to do it.

    And, "bam" the iframe for the 360 is rendered inside the ColorBox dialog instead of a secondary page as I had thought I would need.

    I outlined my changes to accomplish the 360 pano for the image gallery here: https://our.umbraco.org/projects/starter-kits/umazel-starter-kit-responsive-bootstrap-theme/umazel-starter-kit-general-discussion/84547-adding-interactive-360-pano-ability-to-image-gallery

Please Sign in or register to post replies

Write your reply to:

Draft