[AlexandraParticipant]

Hi there,

I’ve been avoiding posting in the forum, and have tried to figure this out myself, but alas…

Is it possible to place the <b>x-card/card element</b> inside of specific cells inside of a responsive table? I’m building the table using the<b> Raw Content</b> element. I’m basically trying to add photos & bio info w/cards, but neither using the shortcode nor inserting the html/text w/raw content or in the text editor has worked.

Example: <i> please ignore all the crap-content inside of the table… work in progress</i>

Thank you sooo, sooo, much, in advance!

[AlexandraParticipant]

This reply has been marked as private.

[AlexandraParticipant]

Using the Ethos stack.

[Rue NelModerator]

Hello There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thank you.

[AlexandraParticipant]

http://swingvoterz.com/politics-voting/presidential-election-2016/

[AlexandraParticipant]

This reply has been marked as private.

[ChristianModerator]

Hey there,

I’ve tested the table setup with Card Element inside and it works on my test site.

When I paste the same code in a test page (http://swingvoterz.com/x-support-test/) I’ve created in your site however, it doesn’t work. Have you made modifications to the theme? If so, please backup and remove them to see if they are affecting the Card Element. Please also disable all third party plugin and scripts. Upon checking the console, there are errors.

Part of your site is calling a script from the old X Shortcodes which does not exist anymore. Please correct it.

Your setup in this page (http://swingvoterz.com/politics-voting/presidential-election-2016/) is incorrect. You have HTML tags within your page.

We’d love to help you with this however, custom setup falls outside the scope of our support.

Thank you for understanding.

[AlexandraParticipant]

Hello,

I understand custom setup and crazy customisations are not provided. I was hoping you might be able to guide me from here though…

1. I just installed the child theme a few days ago, and added a customization regarding portfolios that I saw in the support forum (the code was provided by you guys, not another user); either way, I deleted that markup which appears to have made the test page you created & the home page functional again (i.e., counter was not rendering a # & other elements were broken), but am still receiving the following errs on the page in question – http://swingvoterz.com/politics-voting/presidential-election-2016/:

Uncaught TypeError: x-head.min.js:1 Uncaught TypeError: c.hoverIntent is not a function
(anonymous function) @ x-head.min.js?ver=4.0.6:1
m.Callbacks.j @ jquery.js?ver=1.11.3:2
m.Callbacks.k.fireWith @ jquery.js?ver=1.11.3:2
m.extend.ready @ jquery.js?ver=1.11.3:2
J @ jquery.js?ver=1.11.3:2

&

(index):1232 Uncaught TypeError: windowObj.scrollBottom is not a function
(anonymous function) @ (index):1232
m.Callbacks.j @ jquery.min.js
m.Callbacks.k.fireWith @ jquery.min.js
m.extend.ready @ jquery.min.js
J @ jquery.min.js:2

2. If the homepage and test page you created are rendering correctly after deleting the markup added to the child theme, do or should I reinstall the shortcodes or…?

3. Are html tags not allowed in the Raw Content element, or any element for that matter?

4. I’m basically trying to create a table with 5 or 6 columns and about 20 rows with photos in the 1st column that are flip cards/x-card elements (i.e., photos on front side & short bios on the back side), and popovers/tooltips within the remainder of the columns/rows – is this possible? or are the elements not made to work within a html/css created table?

I am so thankful for your time and patience.
Alexandra

[Rue NelModerator]

Hello There,

Thank you for the very detailed updates.

1 & 2] Please try to re install X and Cornerstone. The js files might have been corrupted.

3] Yes html tags are allowed in the Raw content element.

4] It would be best that you create a row with 5 or 6 columns in it. You can then insert the card element inside the column. Tables are not responsive and the table columns will not break down (stacked to each other) on smaller screens. Card elements do not have any popover/tooltips. You can use an image with popover and tooltips instead.

Please let us know how it goes.

[AlexandraParticipant]

Hi, I reinstalled the shortcodes and deleted my extra javascript in child theme, Customize, and inside of the table (I am assuming this was giving me the errs in Goggle’s ‘inspect element’

Q: Should we not insert src=ajax-this-library or whichever javascript library inside elements (WordPress & X already have most [or all?] of these libraries built in) and there’s no need to enqueue or reference them?

I’ve been trying to work w/the card element inside of the first column, and though it displays the way I want in Cornerstone, the live site does not. This is the code I’m using:

<tbody>
      <tr>
        <th scope="row">
[x_section style="margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; "][x_row inner_container="true" marginless_columns="false" bg_color="" style="margin: 0px auto 0px auto; padding: 0px 0px 0px 0px; "][x_column bg_color="" type="1/1" style="padding: 0px 0px 0px 0px; "][x_card animation="flip-from-right" center_vertically="true" front_style="border-width: 2px 2px 2px 2px; border-style: solid; border-color: #2772a4; color: ; background-color: #fffff;" front_image="http://swingvoterz.com/wp-content/uploads/2015/08/150px-Hillary-Clinton-circle1.png" front_image_width="150px" front_title="Hillary Clinton" front_text="Former Secretary of State" back_style="border-width: 2px 2px 2px 2px; border-style: solid; border-color: #2772a4; color: ; background-color: #fffff;" back_title="" back_text="back content" back_button_text="" back_button_link="#" back_button_color="#ffffff" back_button_bg_color="#744288" padding="0% 0% 0% 0%"][/x_column][/x_row][/x_section] 

<a href="https://www.facebook.com/hillaryclinton">[social style="margin: 0 0.25em; font-size: 1em; align: bottom; class="mtn" type="facebook"]</a>

<a href="https://www.twitter.com/hillaryclinton">[social style="margin: 0 0.25em; font-size: 1em;" type="twitter"]</a>

<a href="https://www.hillaryclinton.com">[social style="margin: 0 0.25em; font-size: 1em;" type="laptop"]</a> </th>

2nd Q: The photo inside of the card element does not display correctly – the photo inside of card element overflows the area in live view

&

3rd Q:The social media/website icons align to the left of the card element and resize themselves in live view, though I would like them underneath the card & fairly small – any help or guidance would be crazy appreciated. 🙂

Thank you again!

[AlexandraParticipant]

This reply has been marked as private.

[AlexandraParticipant]

One more Q: Do we need to or should we add ‘[/x_raw_content][/x_column][/x_row][/x_section]’ at the end of these shortcodes?

^ The live site displays the markup, though in Cornerstone those markups do not display.

[RadModerator]

Hi there,

Are you currently working on it? When I’m checking the whole table is in mess, then after few minutes it looks perfectly fine.

Since you’re working on it, would you mind providing screenshots of issues left? I’m just not sure what should I look for.

About your last question, yes, you should always add closing to shortcodes that has opening.

[x_section][x_row][x_column][x_raw_content][/x_raw_content][/x_column][/x_row][/x_section]

Thanks!

[AlexandraParticipant]

Hi again,

Img 1 Problem occurring upon initial load of the page; card element overflows outside of table cell.
Img 2 When re-sizing the browser window, the card element aligns itself inside of the table cell.

Any help or guidance, is again, truly appreciated. Thank you, in advance! 🙂

[AlexandraParticipant]

This reply has been marked as private.

[Author]

Posts