Forum Replies Created

Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    Posts
  • in reply to: Centering Team Member Containers on The Page #440168

    I appreciate your efforts, Yigit.

    I want to try to restate my problem more clearly. I apologize if I miscommunicated previously.

    Regarding the “Team Member” content element, you can resize it to different sizes.

    Some of these sizes match up to meet the page width quite nicely (for example, having two 1/2 width team member, three 1/3 width team members, etc.).

    You can resize these boxes freely to fill any page you like (for example, if you have 4 team members, you can just use four 1/4 width boxes).

    Alternatively, you can use empty boxes to center things (for example, if you have 2 team members and don’t want them to appear at 1/2-width size, you can put four 1/4-width boxes and leave the outer ones blank so the 2 profiles appear in the middle).

    So far so good.

    However, the size of these boxes is important to me, and I want the team member boxes themselves (not talking about the text, or titles, but the actual content element) to be centered on the page. For example, if I have only one team member in a given section, I don’t want to have to make their profile a full page width, but maybe 1/3 or a 1/4 page width box and have that small team member box be aligned center on the screen. Currently, it is automatically aligns left.

    Here's an example

    Here is a live link to that example.

    Ideally I would want to do this:

    Here's what I would like to do

    To align this single profile center on the page, I would currently have to shrink it to 1/5-width and put two empty boxes on either side, or enlargen it to 1/3 and do the same thing.

    Basically stated, I want the team member content element boxes to automatically align center on the page rather than left, regardless of size. Using empty content boxes is not always an option to kind of ‘trick’ the boxes to align center because sometimes I don’t want to change the team member box size.

    Very sorry for the trouble. Thanks for all your help so far!

    • This reply was modified 9 years, 7 months ago by Apollo87.

    Thank you so much!!! It works!

    Hey Rikard, goodmorning from Japan!

    Here’s the page in question; its a mock re-design of my front page:

    http://www.thejetcoaster.com/home_mockup_B

    As you can see in the first “Featured Content” section if you scroll past the splash art, I’ve got a Masonry blog element displaying a single post. The effect I’m trying to achieve is just like this site: http://www.tofugu.com/ with their “Latest Article” section. The “latest article” image box is short and wide, crops the image top and bottom and displays the title (and tag) in big bold letters across the image.

    I was trying to do this with the Masonry element, but because I’m currently using it on my blog side bar at http://www.thejetcoaster.com/blog/ to display featured post types, I thought I should try to use a different element/shortcode. I THINK I can maybe target JUST that one masonry blog element on the home page, but I’m not sure how. That’s why I’m trying to use the post slider element.

    If you scroll down a little further, you can see I’m using post slider elements for the other content sections like “podcast”, “latest posts” and “from the community”. I really want to be able to use the post slider element for these sections, but to have the titles, metadata and excerpt (or at LEAST the title) displayed INSIDE the image box, just like in the masonry blog element.

    Thank you so very much for your wonderful assistance, Rikard. I’m really hopeful that you can show me how to do it with some css magic.

    Thank you for your help. I will also try more general wordpress/code forums to get further customization. Thanks for bringing me this far and feel free to close the ticket!

    in reply to: BBpress plugin breaks site layout #428701

    We found BBpress was causing too many glitches so we ended up going with a different forum software. Thanks for your help, and you can close the ticket!

    in reply to: BBpress plugin breaks site layout #426878

    However, there were some modifications made to the functions.php a while ago, so could this be the conflict?

    in reply to: BBpress plugin breaks site layout #426877

    We tried to remove the customizations, but even if we remove the custom css it still doesn’t work =/

    in reply to: BBpress plugin breaks site layout #426280

    Sure!

    Here is the layout with the bbpress plugin deactivated:

    the jet coaster front page

    Here is the layout with the bbpress plugin activated:
    the jet coaster front page activated

    Here is the bottom of the page with the bbpress plugin deactivated:
    frontpage bottom deactivated plugin

    Here is the bottom of the page with the bbpress plugin activated:
    bottom activated plugin

    And this is what the page looks like on the page builder:
    pagebuilder

    I tried disabling all of my plugins and removing the custom css, then activating JUST the bbPress plugin, but it still had the same result.

    in reply to: BBpress plugin breaks site layout #425663

    Goodmorning from Japan:)

    Okay, I have successfully updated the theme to 3.1.3!

    However, the issue still persists…

    Looking forward to your guidance on this issue!

    in reply to: Can Enfold handle a huge amount of authors? #418350

    thank you very much. please close this topic

    This reply has been marked as private.

    Thank you for the reply!

    Although the above code didnt quite work for what I was trying to achieve, I eventually managed to figure it out. However some of the code may be redundant. The following works, so I will leave it here for anyone interested in the effect I have achieved on http://www.thejetcoaster.com but if anyone could tell me what is unnecessary that would be even better. Once again, thank you guys so much.

    .av-masonry-entry .av-inner-masonry:hover:before {
        background: rgba(0, 181, 241, 0.1);
    }
    
    .avia_desktop .av-hover-overlay-active .av-masonry-image-container {
    opacity: 1;
    box-shadow: 0 0 150px 5px #000 inset;
    }
    
    .avia_desktop .av-masonry-entry:hover .av-masonry-image-container {
    -webkit-transform: none;
    -moz-transform: none;
    transform: none;
    opacity: .9!important;
    box-shadow: 0 0 150px 5px #000 inset;
     }
    
    .av-masonry-date{ display: none !important;
    }
    .av-masonry-entry .av-inner-masonry-content { 
    background:transparent !important;
      text-align: center; 
     }
    .av-masonry-entry .avia-arrow { display: none; 
    }
    .av-masonry-entry .av-masonry-entry-title {
    background: transparent;
    padding: 10px;
    margin-bottom: 20%;
    font-weight: bold;
      font-size: 30px;
      color: #ffffff !important;
     text-shadow: 2px 2px 4px #000000; }
    
    .avia_desktop.avia_transform3d .av-masonry-entry.av-masonry-item-loaded .av-inner-masonry{
    -webkit-animation: none; /* Safari 4+ */
    -moz-animation:    none; /* Fx 5+ */
    animation:         none; /* IE 10+ */
    }
    
    /*
    .av-masonry-entry:before {
        content: attr(title);
        background: radial-gradient(transparent, black);
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 1000;
        text-align: center;
        line-height: 180px;
        opacity: 0;
        font-weight: bold;
        font-size: 24px;
        color:#ffffff !important;
    }
    
    .av-masonry-entry:hover:before {
        opacity: 1;
    }
    
    .av-masonry-entry:before{
        transition: all linear 0.2s;
    }
    in reply to: Centering Team Member Containers on The Page #410869

    didn’t seem to work.

    this is one part I didn’t understand from your reply:

    “place an empty column element to center elements on desktop” >> what kind of empty column element? i can’t really place an empty element and still center the page which is why i made the topic in the first place. to restate the original issue:

    i have x3 profiles that i want to keep at 1/4 size each. that means i have 3/4 page of content. i can make them all 1/3 of the page and they would naturally center, but i want to keep the size as 1/4 each and have them centered on the page.

    i added all of the profiles into a color section with the section id “contributors”. from there i inputted the CSS as follows:

    .page-id-2062 @media only screen and (max-width: 768px) {
    #contributors .first { display: none !important; }}

    I don’t know if I’m missing something in the code syntax, but I tried with dots before @media as well and a bunch of other combinations. i got the section to budge ONCE with one iteration, but even then the color section only moved slightly right and it wasn’t centered.

    this is the section i am referring to: http://www.thejetcoaster.com/team/#contributors

    in reply to: Centering Team Member Containers on The Page #407491

    OK I’ve uploaded a couple photos to make it clearer.

    This is what it looks like now

    and this is what i’m trying to achieve

    in reply to: Centering Team Member Containers on The Page #407377

    Hey Yigit,

    Sorry maybe i was being unclear. OK you see under “contributors” how there are currently 3 profiles but an obvious blank space on the right (this is because there are currently x3 1/4 team member boxes in the layout being used). I don’t have another member to fill in that area at this moment, so I want to center those 3 profiles ON THE PAGE, not in themselves. And if I only had 2, I would want them centered on the page, and not all the way on the left.

    Does that make sense?

    Hi, thank you so much. I’ve really been struggling with this, and the following spaghetti is the best I could come up with so far:

    ******************

    #top #wrap_all .custom-color-heading .av-special-heading-tag {
    color: #ffffff !important;
    text-shadow: 2px 2px 4px #000000; }

    .av-masonry-entry .av-inner-masonry:hover:before {
    background: rgba(0, 181, 241, 0.7);
    }

    .av-masonry-date{ display: none !important;
    }

    .av-masonry-entry .av-inner-masonry-content {
    background:transparent !important;
    text-align: center;
    }

    .av-masonry-entry .avia-arrow { display: none;
    }

    .av-masonry-entry .av-masonry-entry-title {
    background: transparent;
    padding: 10px;
    margin-bottom: 20%;
    font-weight: bold;
    font-size: 30px;
    color: #ffffff !important;
    text-shadow: 2px 2px 4px #000000;
    }

    .avia_desktop.avia_transform3d .av-masonry-entry.av-masonry-item-loaded .av-inner-masonry{
    -webkit-animation: none; /* Safari 4+ */
    -moz-animation: none; /* Fx 5+ */
    animation: none; /* IE 10+ */
    }

    .avia_desktop .av-masonry-entry:hover .av-masonry-image-container {
    -webkit-transform: none;
    -moz-transform: none;
    transform: none;
    opacity: 1!important;
    }

    /* UNUSED
    .av-masonry-entry:before {
    content: attr(title);
    background: radial-gradient(transparent, black);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1000;
    text-align: center;
    line-height: 180px;
    opacity: 0;
    font-weight: bold;
    font-size: 24px;
    color:#ffffff !important;
    }

    .av-masonry-entry:hover:before {
    opacity: 1;
    }

    .av-masonry-entry:before{
    transition: all linear 0.2s;
    }
    */
    **************

    The EXACT effect I want to replicate is like the masonry on this page:
    http://stophavingaboringlife.com/cats/travel-blog/

    I feel like I am pretty close, but its taking up most of my mental energy and time to figure out how to make the content display just like on that page.

    Specifically what I would like to emulate is:
    – the vignette over the content box, and another deeper vignette on hover
    – the styling of the big title on the big featured post content box on the left
    – Having the author displayed under the title
    – upon hover, the title and author text slides upwards to reveal an excerpt

    Please have a look at my page, and you’ll see that I have three widget areas for featured content. I would also like to apply the same styling as described above on those as well. I can’t figure out how to have the title/author/excerpt display on those just like in the blog masonry element.

    Honestly, thank you so very much for your help. You guys are seriously amazing. If you are ever in Tokyo, beers are on me:)

    • This reply was modified 9 years, 9 months ago by Apollo87.
    in reply to: Website won't display properly on some computers #405534

    Hi Yigit,

    I updated to v3.0.8 but the issue still remains!

    in reply to: Buttons not centered in columns #405533

    I managed to figure this out, so yes thank you!!

    in reply to: Buttons not centered in columns #401818

    Thank you very much! This works, however, one thing I noticed is that my columns are not centered in the middle of the page. The columns I’m referring to are the featured post, featured podcast and featured video on the front page of my site at http://www.thejetcoaster.com

    in reply to: Enfold Showcase #355258

    Would be nice to get some comments on my site if you guys have time^^

    http://www.thejetcoaster.com

Viewing 20 posts - 1 through 20 (of 20 total)