Bootstrap Cards is not working in "View"

This support ticket is created 4 years, 11 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun	Mon	Tue	Wed	Thu	Fri	Sat
-	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	-
-	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	-

Supporter timezone: Asia/Hong_Kong (GMT+08:00)

Tagged: Views, Views plugin

This topic contains 5 replies, has 2 voices.

Last updated by Luo Yang 4 years, 11 months ago.

Assisted by: Luo Yang.

Author

Posts

February 19, 2020 at 4:59 am #1515775

Aditya Deshmukh

I am trying to: integrate a bootstrap card in Toolset blocks with the help of "Fields and Text" blocks in view block. The view is set to display the cards in 3 columns. The view is outputting the number of columns right but the cards are displayed weirdly.

Link to a page where the issue can be seen: hidden link

I expected to see: something similar to the card view (in the "LATEST LISTINGS" section) on this webpage - hidden link

Could you please look into the issue and let me know how can we find a solution for it?

February 19, 2020 at 7:15 am #1515869

Luo Yang

Hello,

I have checked the URL you mentioned above, the HTML div tags are broken, for example, I suggest you try to create a new fresh page and fresh view by follow our document:
https://toolset.com/documentation/user-guides/views/view-layouts-101/#bootstrap

And test again.

February 19, 2020 at 7:05 pm #1516959

Aditya Deshmukh

Hello Luo,

I'm currently using Blocks to create a view. Isn't it possible to design the grid with Toolset Blocks?

February 20, 2020 at 3:06 am #1517485

Luo Yang

Yes, it is possible to design the grid with Toolset Blocks.

You can add a view block, find and select section "View Loop", in the right column, there is a "Grid settings" section, see screenshot grid-setting.JPG

February 20, 2020 at 6:11 am #1517737

Aditya Deshmukh

Hello Luo,

I mean to say isn't it possible to incorporate Bootstrap cards with Toolset Blocks. The document you mentioned above explains how to add Bootstrap elements with Toolset Views plugin. I would like to know is it possible to use Bootstrap cards in Toolset block (creating the view in Blocks itself).

Thanks!!

February 20, 2020 at 6:31 am #1517745

Luo Yang

Yes, it is possible and very easy to incorporate Bootstrap cards with Toolset Blocks, I have tired it in my localhsot(Fresh WordPress installation + the latest version of Toolset plugins) with below steps:
1) Dashboard-> Toolset-> Settings-> General, in section "Bootstrap loading", enable option "Toolset should load Bootstrap 4"
2) Create some test posts,
3) Create a page, insert a view block,
4) In "View Loop", insert a "Fields and Text", swith to HTML editor, copy the HTML codes from Bootstrap, and inser the post link shortcode
hidden link

<div class="card" style="width: 18rem;">
  <img class="card-img-top" src="..." alt="Card image cap">
  <div class="card-body">
    <h5 class="card-title">[wpv-post-link]</h5>
    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
    <a href="#" class="btn btn-primary">Go somewhere</a>
  </div>
</div>

It works fine, see screenshot cards.JPG