I am using Porto on Magento 2.2.5,
in the products page there is a text box under the attribute labels, how can I remove it or hide it.
link to product page:
link to product page
screenshot:
tnx,
Magento Stack Exchange is a question and answer site for users of the Magento e-Commerce platform. It only takes a minute to sign up.
Sign up to join this communityI am using Porto on Magento 2.2.5,
in the products page there is a text box under the attribute labels, how can I remove it or hide it.
link to product page:
link to product page
screenshot:
tnx,
The input field needs to be hidden using the attribute ‘type="hidden"’. This appears to be one of those fields that is supposed to be hidden and holds the 'ID' of the primary key for the attribute's option. (My personal opinion is that this is a work-around to some sort of limitation or difficulty the developer was having with associating IDs to Values for attribute options)
Reference: https://www.w3schools.com/tags/att_input_type_hidden.asp
Since I am unfamiliar with that theme that you are using, I would say to first start by looking in the theme's files <magento_root>/app/design/frontend/<Vendor>/<theme>
Documentation on the theme structure can be found here:
https://devdocs.magento.com/guides/v2.3/frontend-dev-guide/themes/theme-structure.html
If you could grep the contents of the files in the theme to find this, that would be a good start. Otherwise, try looking in phtml files under the Magento_Catalog module folder in that theme. Look for things relating to product/view, configurable, options, etc..
You could turn on template and block hints, but if you don't have a development environment set up, then do not do this. A production site with template and block hints turned on is a security and performance issue.
Once you find that <input...
, update the html element's attribute for type from type="text"
to type="hidden"
, so the result is.. <input type="hidden" ...
I've confirmed that everything still works when the type is changed to hidden and an option is selected. The input field is updated with the option ID of the value selected.
Alternative solution (and probably easiest)
Update CSS stylesheet or add <style>
code:
CSS Stylesheet:
.swatch-attribute-options ~ .swatch-input.super-attribute-select {
display:none !important;
}
html
<style>
.swatch-attribute-options ~ .swatch-input.super-attribute-select {display:none !important;}
</style>