15 comments

So I purcheed this template a week ago working with PHP Laravel 5.4 framework.
I got to addapt the template to my dev-language on the page "checkout2.html" -> where you get a radio button form to fill out:

<input type="radio" name="shippping" id="option3" class="radio-template">

the problem is as so:
In order to submit information to the server I MUST deliver the attribute(name="foo") with a different value for each selected button BUT if you try to change >> name="shippping" << to a different value the CSS / SASS has malfunctions.
the selected buttons are kept in a checked mode and there's no possibility to either change or remove selections
Hi,

I re-read your question and I saw the issue.

Your problem is that you have to name all the radio inputs with the same name (i.e. name="shipping") and assign only different values to them. This is a standard and correct approach for radio lists in HTML. This way the browser knows all these belong to the same selection and therefore allow only one selected possibility.

Best.

Ondrej
Hi,

thanks for buying.

Can you paste your code that you have inside .tab-block? Either here or even better on the Codepen.

Thanks,

Ondrej
<!-- .tab-block AS Laravel 5.4 -->
<div id="delivery-method" class="tab-block">
<form action="{{ url('order/delivery') }}" method="POST" class="shipping-form">
{{ csrf_field() }}
<div class="row">
<div class="form-group col-md-6">
<input type="radio" name="shippping" id="option1" value="shipping" class="radio-template">
<label for="option1">
<strong>Usps next day</strong><br>
<span class="label-description">Get it right on next day - fastest option possible.</span>
</label>
</div>
</div>
<div class="CTAs d-flex justify-content-between flex-column flex-lg-row">
<a href="{{ url('order/address') }}" class="btn btn-template-outlined wide prev">
<i class="fa fa-angle-left"></i>Back to Address
</a>
<input class="btn btn-template wide next" type="submit" id="submit" name="submit" value="Choose delivery method ❯">
</div>
</form>
</div>
<!-- /.tab-block AS Laravel 5.4 -->
Hi,

thanks. From the content I can see here, the code is the same as in the template and should be working HTML and CSS-wise and there should not be any display issues.

To be able to help further, please provide an online demonstration (you can send me a private message here on WB or my email is in the template's documentation).

Thanks,

Ondrej
allberg PURCHASED
Hi!

I bought this layout some time ago and I'm now implementing it in a react application. Since not all tags are closed I'm getting compilation errors from react which are easy to fix but still annoying.

It would be a good thing for the next release if you could make sure all tags are closed, for example img.

/John
Hi John,

thank you for buying. Sorry to hear about your troubles, though.

Do you mean <img> vs <img />, <link> vs <link /> and similar? If so, these are void elements in HTML and do not need closing/ self-closing and the document validates perfectly. If you mean something a bit different, please let me know.

Best,

Ondrej
allberg PURCHASED
Hi Ondrej!

Yes, I mean <img> versus <img /> and you're totally right, <img> works nicely in pure HTML.

However, when putting them in a JSX file to be handled by reactjs (a javascript framework by Facebook and Instagram) it requires the tags to be closed.

I'm not saying that your html is wrong, but it would be helpful if in the next release the tags would be closed, to be more "react-compatible" so to speak.

Best regards,

John
Hi John,

thanks for your reply, I see.

Unfortunately, I can't help you with this as this is an HTML template, so I need to stick with the HTML specs.

Quoting from https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img - "<img> must have a start tag and must not have an end tag".

Sorry, I could not help more.

Best,

Ondrej
allberg PURCHASED
You're totally right, a img tag may never have an end tag since the img is a void element or empty element. But I'm not talking about the end tag ("</img>"), I'm talking about the optional slash at the end of the start tag:

http://w3c.github.io/html-reference/syntax.html#void-element
"5. Optionally, a "/" character, which may be present only if the element is a void element."

But I'm not going to nag you about this, it was just a friendly request. I think it's a really good template, so keep up the good work!
Hi,

I am having issues with bs-select. I have loaded all css and js as external style sheets and scripts, respectively, but still can't seem to get it to work correctly. That particular dropdown does not want to cooperate (won't dropdown and the caret does not display). Here is a link to the codepen: https://codepen.io/matthew-spire/pen/gzNwrL/. Please let me know if you're able to help. Thank you!
Hi Matthew,

thanks for purchasing!

I forked your pen here: https://codepen.io/ondrejsvestka/pen/pVXmbB

Problems you had there:

- bootstrap-select.min.css - gave 403 in your pen, according to the console
- popper.js was not properly loaded - I usually include it before Bootstrap JS, so most probably just an issue of the script ordering
- additinally, I use Font Awesome 4.7, will be upgrading soon but using FA5 was causing a missing icon in the dropdown

Best,

Ondrej
Thank you so much! Great help and excellent response! <3
Hey, no problem! Glad it helped.
Okay, one other question and I apologize in advance (I did attempt on my own with no success). If I have imgaes of varying height, how might I go about applying autoHeight? I tried following http://www.landmarkmlp.com/js-plugin/owl.carousel/demos/autoHeight.html and https://owlcarousel2.github.io/OwlCarousel2/demos/autoheight.html with no success. Thank you!

Write a comment

This is a great way to give the seller feedback and ask them questions about their item.

You must sign in to write a comment

Sign in or sign up to make a purchase

$20
96Purchases

Licenses: Details »

Single application $20
Version:1.3.1
Type:
  • HTML Template
Bootstrap: Compatible with 4.x
Layouts:
  • Responsive
Browsers:
  • IE 10, 11
  • Latest Chrome
  • Latest Edge
  • Latest Firefox
  • Latest Safari
Uses Less:No
Uses Sass:Yes
Category:
Topic: Fashion & Apparel
Labels: bootstrap 4, cart, commerce, ecommerce, modern, order, shop
Item#:WB04C422K
Released:8 months ago
Updated:1 month ago
Sold exclusively on WrapBootstrap
ondrique

ondrique

Signed up 4 years ago

Need an admin template?

About Bootstrap

Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex.

Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples.

Built to support new HTML5 elements and syntax with progressively enhanced components.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer.

Tested and supported in Chrome, Safari, Firefox, Internet Explorer, and Opera.
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
  • Latest Edge
  • Internet Explorer 10/11
  • Latest Opera

Features & includes

Bootstrap provides an unparalleled array of features and reusable components that let you hit the ground running:

  • Responsive 12-column grid
  • 12 custom, modular jQuery plugins
  • CSS styles for forms, navigation & more
  • Dozens of reusable components
  • Components are scaled according to a range of resolutions and devices
  • Built with Sass (CSS included)
  • Complete styleguide documentation