[Resolved] Bootstrap grid in view

[Author]

Posts

[BiernackiH1367]

Hello
I use toolset type and view to make a search engine and a list of results. everything works fine, but I need help to customize the layout.
I use a bootstrap 2/3 -1/3 grid, and I do not know how to modify the Css to have my image in column 2/3 in full display. I would also like to add a background and a border to column 1/3. I would also like to create a separation between the 2 columns. Finally how to have a separation between each row.
here is the current page: http: //t62-dev-wp1.noogaa.com/2-2/? preview_nonce = a1e7ba1dbd & preview = true & wpv_view_count = 493-TCPID468 & wpv-post_tag = 0 & wpv-wpcf-city = & wpv_aux_current_post_id = 468 & wpv_paged = 1
thank you so much
have a good day
cordially
Harold

[Waqar]

Hi Harold,

Thank you for contacting us and glad you find our plugins useful.

The Toolset plugins are designed to offer a flexible and easy to use solution to build complex websites, which otherwise would require a deeper understanding of database and PHP programming skills.

In terms of design, it provides a standard scaffolding, that would work for most users out-of-the-box. But, with different projects and client requirements, it is quite understandable that customization may become necessary.

That's where custom PHP, HTML and CSS code comes in. Our plugins maintain a very flexible environment so that users can add as many customizations as needed to their projects, based on their requirements and skills.

As much as we would like to help, 1-1 customization assistance is beyond the scope of support that we provide. You can read the details about what is covered, in our support policy at:
https://toolset.com/toolset-support-policy/

We do our best to guide in the right direction though and to find the right elements to target through custom CSS code, you'll find Chrome's DevTools most useful:
hidden link

You'll also find a number of articles in our documentation section related to working with custom CSS:

https://toolset.com/documentation/user-guides/adding-custom-css-views/
https://toolset.com/documentation/beyond-the-basics/leverage-existing-styles-and-add-new-css/
https://toolset.com/faq/learning-basic-html-and-css/

For someone who is not comfortable working with HTML and CSS, our recommendation is to hire a professional from our recommended contractors:
https://toolset.com/contractors/

For questions and concerns related to Toolset plugin functionalities, you're welcome to write to us, anytime.

I hope this helps.

regards,
Waqar

[BiernackiH1367]

Thanks for your answer
but I still have a problem. I'm using this line of <col class = "col-sm-8"> [wpv-post-featured-image size = "large"] </ div> to get the result I'm looking for. It works, but the images inside the block are resized and I do not understand how to fix the problem.
Thanks for your help
good day and good Christmas
Harold

[Waqar]

Hi Harold,

Thanks for writing back and I'd be happy to assist.

If you'd like to call in the image in its original uploaded size, you can replace the "large" attribute value with "full":

<div class = "col-sm-8"> [wpv-post-featured-image size = "full"] </ div>

You'll find more information about the available attributes for the "wpv-post-featured-image" shortcode at:
https://toolset.com/documentation/user-guides/views-shortcodes/#vf-153425

Note: In case the shortcode is still not showing the image as expected, you're welcome to share the link to the page, where it can be seen.

Happy Holidays and Merry Christmas!

regards,
Waqar