Hi. I have managed to remove the account/login icon from my desktop header although it is still apparent on my mobile site.
I believe I know what piece of code to edit although am a bit unsure on what to change.
The image below show what part of the menu I wish to remove and I want the black box to fully extend across if that makes any sense.
If anyone could help it would be very much appreciated.
the link to my website is www.furfree.co.uk and I have attached the part of code below that I believe needs editing.
<div class="menu_moblie d-flex d-xl-none jsmenumobile align-items-center {% unless settings.enable_sticky_mobile %}engoc-disable-sticky{% endunless %}">
<a href="javascript:void(0)" title="" class="menuleft">
<span class="iconmenu">
<span></span>
<span></span>
<span></span>
</span>
</a>
<div class="logo_menumoblie">
{% if settings.logo_svgmobile != blank %}
<a href="{{shop.url}}">{{settings.logo_svgmobile}}</a>
{% else %}
<a href="{{shop.url}}">
{% if settings.logo_mobile != blank %}
<img src="{{settings.logo_mobile|img_url:'master'}}" width="{{settings.mobile_logo_maxwidth}}" alt="logo">
{% else %}
<img src="//placehold.it/40x40" width="{{settings.mobile_logo_maxwidth}}" alt="logo">
{% endif %}
</a>
{% endif %}
</div>
<div class="menuright">
<a href="javascript:void(0)" class=" pr-3 js-search-destop">
{% if settings.hd_icon_search_svg != blank %}
{{settings.hd_icon_search_svg}}
{% else %}
<i class="{{settings.hd_icon_search}}"></i>
{% endif %}
</a>
<a href="javascript:void(0)" title="" class="js-call-minicart">
{% if settings.hd_icon_cart_svg != blank %}
{{settings.hd_icon_cart_svg}}
{% else %}
<i class="{{settings.hd_icon_cart}}"></i>
{% endif %}
<span class="count_pr_incart enj-cartcount">{{cart.item_count }}</span>
</a>
</div>
</div>
<div class="box_contentmenu_background">
</div>
<div class="box_contentmenu">
<div class="tab_content_menu_mobile">
<ul class="nav nav-tabs toptab_box_content list-unstyled mb-0" role="tablist">
<li class="toptab_li">
<a class="tab_navar active" href="#tab_menu_mobile" role="tab" data-toggle="tab">
<span class="tab-menu-icon">
<span></span>
<span></span>
<span></span>
</span>
<span class="ml-3">{{ 'layout.navigation.menu' | t }}</span>
</a>
</li>
<li class="toptab_li">
<a class="tab_navar_right" href="#tab_account_mobile" role="tab" data-toggle="tab">
<i class="icon-icon-user"></i>
<span class="ml-2">{{ 'customer.login.title' | t }}</span>
</a>
</li>
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane show in active tab_children_menu" id="tab_menu_mobile">
{% assign i = 1 %}
{% assign main_menu = settings.main_menu_store %}
{% for link in linklists[main_menu].links %}
{% assign item = link.title | downcase %}
{% assign child_list_handle = link.title | handleize %}
{% if linklists[child_list_handle].links != blank %}
<div class="menu-horizon-list">
{% if link.title contains '[' %}
{%- assign label = link.title | split: '[' | last | split: ']' | first -%}
{%- assign bgc = link.title | split: '(' | last | split: ')' | first -%}
<a href="{{ link.url }}" title="{{link.title | split: '[' | first }}" class="relative nammenu ">{{link.title | split: '[' | first }}
<span class="absolute label_menu label_menu-{{link.title | handleize}}-{{forloop.index}}" {% if link.title contains '(' %}style="background-color: {{link.title | split: '(' | last | split: ')' | first}};"{% endif %}><span>{{link.title | split: '[' | last | split: ']' | first}}</span></span>
<style>
.label_menu-{{link.title | handleize}}-{{forloop.index}}:before {
border-top: 4px solid {{link.title | split: '(' | last | split: ')' | first}};
}
</style>
</a>
{% else %}
<a href="{{ link.url }}" title="{{link.title | split: '[' | first }}" class="relative nammenu ">{{link.title | split: '[' | first }}</a>
{% endif %}
<a href="#c{{i}}" class="toggle-menumobile collapsed js_icon_horizon-menu" data-toggle="collapse" aria-expanded="false">
<i class="fa fa-angle-right"></i>
</a>
<div id="c{{i}}" class="collapse " >
{% for childlink in linklists[child_list_handle].links %}
{% assign grand_child_list_handle = childlink.title | handle %}
{% if linklists[grand_child_list_handle].links != blank %}
<h2 class="title_menu_mb relative">
<a href="{{childlink.url}}">{{childlink.title}}</a>
{% if childlink.title contains '[' %}
<a href="{{ childlink.url }}" title="{{childlink.title | split: '[' | first }}" class="delay03 uppercase menu_lv1 "><span>{{childlink.title | split: '[' | first }}</span>
<div class="absolute label_menu label_menu-{{childlink.title | handleize}}-{{forloop.index}}" {% if childlink.title contains '(' %}style="background-color: {{childlink.title | split: '(' | last | split: ')' | first}};"{% endif %}>{{childlink.title | split: '[' | last | split: ']' | first}}</div>
<style>
.label_menu-{{childlink.title | handleize}}-{{forloop.index}}:before {
border-top: 4px solid {{childlink.title | split: '(' | last | split: ')' | first}};
}
</style>
</a>
{% else %}
<a href="{{ grandchildlink.url }}" title="{{grandchildlink.title | split: '[' | first }}" class="delay03 uppercase menu_lv1 "><span>{{grandchildlink.title | split: '[' | first }}</span></a>
{% endif %}
</h2>
<ul class="list-unstyled mb-0">
{% for grandchildlink in linklists[grand_child_list_handle].links %}
<li>
{% if grandchildlink.title contains '[' %}
{%- assign label = grandchildlink.title | split: '[' | last | split: ']' | first -%}
{%- assign bgc = grandchildlink.title | split: '(' | last | split: ')' | first -%}
<a href="{{ grandchildlink.url }}" title="{{grandchildlink.title | split: '[' | first }}" class="relative delay03 uppercase menu_lv1 "><span>{{grandchildlink.title | split: '[' | first }}</span>
<div class="absolute label_menu label_menu-{{grandchildlink.title | handleize}}-{{forloop.index}}" {% if grandchildlink.title contains '(' %}style="background-color: {{grandchildlink.title | split: '(' | last | split: ')' | first}};"{% endif %}>{{grandchildlink.title | split: '[' | last | split: ']' | first}}</div>
<style>
.label_menu-{{grandchildlink.title | handleize}}-{{forloop.index}}:before {
border-top: 4px solid {{grandchildlink.title | split: '(' | last | split: ')' | first}};
}
</style>
</a>
{% else %}
<a href="{{ grandchildlink.url }}" title="{{grandchildlink.title | split: '[' | first }}" class="delay03 uppercase menu_lv1 "><span>{{grandchildlink.title | split: '[' | first }}</span></a>
{% endif %}
</li>
{% endfor %}
</ul>
{% else %}
<h2 class="title_menu_mb title_only_one"><a href="{{childlink.url}}">{{childlink.title}}</a></h2>
{% endif %}
{% endfor %}
</div>
{% assign i= i| plus :1 %}
</div>
{% else %}
<div class="menu-horizon-list ">
{% if link.title contains '[' %}
{%- assign label = link.title | split: '[' | last | split: ']' | first -%}
{%- assign bgc = link.title | split: '(' | last | split: ')' | first -%}
<a href="{{ link.url }}" title="{{link.title | split: '[' | first }}" class="nammenu relative delay03 uppercase menu_lv1 "><span>{{link.title | split: '[' | first }}</span>
<div class="absolute label_menu label_menu-{{link.title | handleize}}-{{forloop.index}}" {% if link.title contains '(' %}style="background-color: {{link.title | split: '(' | last | split: ')' | first}};"{% endif %}>{{link.title | split: '[' | last | split: ']' | first}}</div>
<style>
.label_menu-{{link.title | handleize}}-{{forloop.index}}:before {
border-top: 4px solid {{link.title | split: '(' | last | split: ')' | first}};
}
</style>
</a>
{% else %}
<a href="{{ link.url }}" title="{{link.title | split: '[' | first }}" class="nammenu delay03 uppercase menu_lv1 "><span>{{link.title | split: '[' | first }}</span></a>
{% endif %}
</div>
{% endif %}
{% endfor %}
</div>
<!-- tab account login-regester-->
<div role="tabpanel" class="tab-pane fade" id="tab_account_mobile">
<div class="overlay_login-content">
<div class="row justify-content-center box_content_accountdestop text-center">
<div class="formlogin">
<div class="login_primary CustomerLoginForm">
<div class="login-icon">
<span class="icon-icon-user"></span>
</div>
<div class="mailrrr mt-3">
{% form 'customer_login' %}
{{ form.errors | default_errors }}
<div class="form-group">
<input type="email" class="form-control" name="customer[email]" placeholder="{{ 'customer.login.email' | t }}" required>
</div>
{% if form.password_needed %}
<div class="form-group">
<input type="password" class="form-control" placeholder="{{ 'customer.login.password' | t }}" name="customer[password]" required>
</div>
{% endif %}
<div class="form-check">
{% if form.password_needed %}
<a href="#recover" class="RecoverPassword">{{ 'customer.login.forgot_password' | t }}</a>
{% endif %}
</div>
<button type="submit" class="btn btn-dark w-100" value="{{ 'customer.login.log_in' | t }}">
{{ 'customer.login.log_in' | t }}
</button>
{% endform %}
</div>
<div class="or_creat my-3">
<span>{{ 'customer.login.or' | t }}</span>
<div><a href="javascript:void(0)" class="jsCreate_account">{{ 'customer.account.register_now' | t }} <i class="ml-3 ti-arrow-right"></i></a></div>
</div>
</div>
{% form 'recover_customer_password' %}
{{ form.errors | default_errors }}
{% comment %}
Assign variable to be used after timber.init() is run in theme.liquid
{% endcomment %}
{% if form.posted_successfully? %}
{% assign resetPassword = true %}
{% endif %}
<div class="RecoverPasswordForm" style="display: none;">
<div class="block-login">
<span>
<i class="ti-reload"></i>
</span>
<h2 class="title24 text-center title-form-account">{{ 'customer.recover_password.title' | t }}</h2>
<div class="form-group row">
<div class="col-sm-12">
<input type="email" class="form-control" placeholder="{{ 'customer.login.email' | t }}" name="customer[email]" {% if form.email %} value="{{ form.email }}"{% endif %} required>
</div>
</div>
<div class="text-center mt-3">
<input type="submit" class="register-button" value="{{ 'customer.recover_password.submit' | t }}">
</div>
<div class="table-custom create-account">
<div class="text-center mt-4">
<a class="HideRecoverPasswordLink" style="cursor: pointer;" class="color">{{ 'customer.recover_password.cancel' | t }}</a>
</div>
</div>
</div>
</div>
{% endform %}
</div>
<div class="form_register">
<div class="login_primary">
<div class="login-icon register-icon">
<span class="ti-pencil-alt">
</span>
</div>
<span class="title_resgister">{{ 'customer.register.title' | t }}</span>
<div class="mailrrr mt-3">
{% form 'create_customer' %}
{{ form.errors | default_errors }}
<div class="form-group">
<input type="email" placeholder="{{ 'customer.register.email' | t }}" class="form-control" name="customer[email]" {% if form.email %} value="{{ form.email }}"{% endif %} required>
</div>
<div class="form-group">
<input type="password" class="form-control" name="customer[password]" placeholder="{{ 'customer.register.password' | t }}" required>
</div>
<button type="submit" class="btn btn-dark w-100" value="{{ 'customer.register.submit' | t }}">
{{ 'customer.register.submit' | t }}
</button>
{% endform %}
</div>
<div class="or_creat my-3">
<span>{{ 'customer.login.or' | t }}</span>
<div><a href="javascript:void(0)" class="jsBack_login">{{ 'customer.login.back_to_login' | t }} <i class="ml-3 ti-arrow-right"></i></a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="close-menu-mobile text-center js-eveland-close">
<i class="ti-close mr-3"></i>Close
</div>
</div>
</div>
try to remove
<li class="toptab_li">
<a class="tab_navar_right" href="#tab_account_mobile" role="tab" data-toggle="tab">
<i class="icon-icon-user"></i>
<span class="ml-2">{{ 'customer.login.title' | t }}</span>
</a>
</li>
and add the css
.box_contentmenu .tab_content_menu_mobile{
width: 100%;
}
@Aaron_mihell1 - try by adding following css to the end of style-main.css
.nav-tabs .toptab_li{width: 100%;}
.nav-tabs .toptab_li:nth-child(2){display:none; visibility:hidden;}
User | Count |
---|---|
397 | |
205 | |
129 | |
53 | |
42 |