We're merging with GenerateBlocks! Learn more here.

[Resolved] Cards, and recovering from the Set Card Styles button

Please login to receive premium support.

Support for the free plugin can be found here.

Home › Forums › Pro Support › Cards, and recovering from the Set Card Styles button

Tagged: 

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • October 11, 2019 at 11:44 am #11429
    Daniel
    Participant

    Hi,
    I’m missing documentation for Cards. I’m aware of the demos page, but I have a couple of questions regarding how to use. Specifically:

    1) Besides the Card demo page, is there an explanation of how and what the “Set Card Styles” button actually does (besides the one sentence description underneath the button)?

    2) If one presses that button, is the only way to restore the previous style settings (applied to the future lists) to re-install the plugin and delete all existing data? Or is there some other way?

    3) I’m looking to achieve something like “Overlay Style 1” (and the hover effect which reveals new fields), but with 3 columns of images approx. 440×370 (something similar to the dimensions of “5 Myths” and “Cause Marketing” cards.

    I suppose my sense of the way Cards work is different than the reality. Just looking for some docs and guidance.

    Thanks,
    Dan

    October 12, 2019 at 9:48 am #11450
    Daniel
    Participant

    I discovered some other behavior which seems to have surfaced after pressing the “Set Card Styles” button. It could be coincidence, but based on how much I’ve been using WP Show Posts previously, I doubt it. First the behavior, then the steps to recreate.

    Behavior:
    Now (using the Gutenberg editor), any pages which include WP Show Posts shortcodes display correctly on the front-end. However, if I attempt to edit that page in admin, the page editor frame displays an editor for the first post in the list which would have been displayed by the shortcode. Yes, bizarre. I can no longer edit the page or its content at all. Note: this happens when I create WP Show Post lists with posts, custom post types, etc. When I use other post grid plugins (e.g., Ultimate Add-ons for Gutenberg) to achieve a similar effect, I do not get this type of behavior.

    I have attempted to deactivate WP Show Post and Pro plugins, even deleting data. However, lists are preserved and I suppose other table entries are too. I have even resorted to deleting all Lists and also any pages where WPSP shortcodes may have been used. No luck.

    How I recreate it:
    1) Create a List. (from Posts, Custom Posts, doesn’t matter).
    2) Create a new page…in the Gutenberg editor. Enter a title, some text, then the WP Show Post shortcode referencing the List created in 1.
    3) Save draft, preview the page. It looks more or less as expected on the front-end.
    4) Now, attempt to edit the page (be sure to re-access it via “All Pages” in the Page editor). Page content is now missing. In fact, inside the editor frame is the first post in the List referenced in the shortcode.

    Happy to give you access to my development site to see for yourself.

    Thanks,
    Dan

    October 16, 2019 at 11:06 am #11495
    Tom
    Keymaster

    Hi there,

    1. That button changes various settings within the current list to work along with the card style. For example, if a card needs the title above the featured image, it will set that option for you.

    2. If you save the list after clicking the button, you will need to manually revert the options back to what you need within that specific list. The button doesn’t do anything when it comes to future lists.

    3. Have you tried setting that card along with 3 columns/image sizes in the options? It should all work nicely.

    Any chance you can open a new topic for the other issue?

    Thanks!

    October 31, 2019 at 7:55 am #11747
    Daniel
    Participant

    Thanks, Tom. Am getting the hang of this. I now have this result.

    I have a style question now. I’d like to achieve:

    Display: Title and Location (a custom field).
    On hover, display: Title, Terms, and Content/Excerpt
    Note: The Title is unlinked, via a wpsp_disable_image_link filter snippet.

    The style (layout and effect) I want is like the “case study explorer” section of this page.

    Is this possible? How?

    Thanks again,
    Dan

    November 4, 2019 at 6:15 pm #11795
    Tom
    Keymaster

    Looks like the only thing missing is the hidden/display on hover meta?

    If so, try adding this:

    .wpsp-overlay.wpsp-ov-style-one .wp-show-posts-entry-meta {
    opacity: 0.0;
    -webkit-transform: translateY(1em);
    transform: translateY(1em);
    -webkit-transition: all 0.3s cubic-bezier(.33, .66, .66, 1);
    transition: all 0.3s cubic-bezier(.33, .66, .66, 1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.wpsp-overlay.wpsp-ov-style-one .wp-show-posts-inner:hover .wp-show-posts-entry-meta {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}
    November 10, 2019 at 4:46 am #11861
    Daniel
    Participant

    Thanks, Tom. Just copying your CSS code didn’t work. I ended up working with someone for the CSS I needed.

    I have everything working — except that I wanted to achieve a slide-in from the bottom overlay (like in the example or something like this: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_image_overlay_slidebottom).

    Any ideas how to achieve that?

    November 12, 2019 at 5:29 pm #11876
    Tom
    Keymaster

    Did you get this sorted? It looks like your overlay is sliding up now.

    Let me know 🙂

    November 13, 2019 at 7:20 am #11884
    Daniel
    Participant

    Thanks for the follow-up, Tom. It was more complex than expected, but I got it sorted.

    November 18, 2019 at 5:13 pm #11936
    Tom
    Keymaster

    Awesome 🙂

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