Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • September 12, 2016 at 8:18 pm #685339
    brettb112

    I want to replicate almost the exact same element that is in enfold demo (img url below). I would like to have a sidebar running down the left hand side with separate entries for pictures (see below)

    Picture: http://imgur.com/a/sVpJH (inside the red area)

    September 12, 2016 at 8:43 pm #685348
    Yigit

    Hey brettb112!

    That is tabs elements. You can see examples here – http://kriesi.at/themes/enfold/shortcodes/tabs/

    Regards,
    Yigit

    September 12, 2016 at 9:55 pm #685385
    brettb112

    thanks yegit, when uploading the images into the tabs, is there any way to make them larger when clicking on them?

    For example, when I upload multiple images under the first tab, I would like to click on an image in the tab that opens up the selected image to a bigger size.

    If you need better clarification let me know.

    thanks

    September 13, 2016 at 12:39 pm #685697
    Yigit

    Hi,

    You can enable debugging mode to see shortcodes you have created in pages using Advanced Layout Builder – http://kriesi.at/documentation/enfold/enable-advanced-layout-builder-debug/

    Or, You can switch to Default Editor and click on Magic Wand to see full list of shortcodes http://i.imgur.com/n4KXkdm.jpg
    then you can create any of them and copy/paste shortcode into any other content element or into text widget.

    If that is not what you meant, yes, please elaborate :)

    Best regards,
    Yigit

    September 17, 2016 at 1:20 am #687774
    brettb112

    Ok, yeah im a little confused.

    I would like my page to look like this:

    View post on imgur.com

    I want images where the red boxes are, and I want the option of clicking on the image to make it larger if someone wants to see a bigger version of the picture.

    Any help would be appreciated, thnks Yigit :)

    September 17, 2016 at 5:30 am #687811
    Vinay

    Hi,

    Like Yigit mentioned

    1. Enable debug mode.
    2. Create a gallery on an empty page.
    3. Copy the page shortcode.
    4. Paste the shortcode in the tab.

    Let us know if you have any questions.

    Best regards,
    Vinay

    September 18, 2016 at 7:35 pm #688178
    brettb112

    ok, I tried the copy and paste short code technique and it works very well.

    The only thing I need to fix is the fact that there are only 3 options for size: “small thumbnails”, “big image with thumbnail below”, and “big images only”.

    I clicked on the small thumbnail option (as it suits it the best), but they are still a little small. Is there a way to make thumbnails a bit bigger, and possibly shorten the spacing between thumbnails also.

    thanks vinay
    brett

    September 18, 2016 at 9:28 pm #688211
    Vinay

    Hi,

    Sure we are happy to help you with this. I checked all the main pages of your site but could not see the tab with icons anywhere Would you mind providing a precise link to your site, showing the elements in question? We need to be able to inspect them in order to help :)

    Best regards,
    Vinay

    September 20, 2016 at 1:34 am #688872
    brettb112

    hello Vinay,

    just added a couple of temporary pictures here. Ill be removing them and replacing them with others in the next couple days.

    But i would just like to know how I would go about making the picture thumbnails slightly larger..

    thanks
    brett

    September 20, 2016 at 1:09 pm #689147
    Yigit

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    @media only screen and (min-width: 1024px) {
.tab_inner_content .avia-gallery-thumb a {
    width: 25%!important;
}}

    Best regards,
    Yigit

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.