Return to previous page

User Icon to My Account - by Gry4you - on WordPress WooCommerce support

This topic has 27 replies, 3 voices, and was last updated 8 years ago ago by Rose Tyler

  • 26 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 14, 2017 at 10:22

    Hello,

    Could you please provide wp-admin access in Private Content?

    Regards

    #177531 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 14, 2017 at 11:12

    No. I would like to modify myself.

    I only need php code to add, just like here:
    https://www.8theme.com/topic/header-my-account-with-username/

    #177551 Copied
    Avatar: Olga Barlow
    Olga Barlow
    Participant
    November 14, 2017 at 15:26

    Hello,

    We need to check the header type to provide you correct code. So, please, provide me temporary admin panel access to check your site and give you the answer.

    Regards

    #177592 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 14, 2017 at 15:56

    Hi,

    I chose Variant xstore header type.

    Variant hamburger has user icon like <i class=”fa fa-user-o” aria-hidden=”true”></i>, but I can’t add php code to Variant xstore.

    Access to admin panel is not safe for me.

    Regards

    #177601 Copied Theme version: 4.12 WooCommerce version: 3.2.3
    Avatar: Gry4you
    Gry4you
    Participant
    November 15, 2017 at 10:45

    And! Someone help me???

    #177652 Copied Theme version: 4.12 WooCommerce version: 3.2.3
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 15, 2017 at 11:00

    Hello,

    Please add this code in Theme Options > Styling > Custom css:

    .login-link:before {
    content: "\e1000";
    font-family: 'xstore-icons';
    position: absolute;
    left: -8%;
    top: 1%;
}

    Regards

    #177654 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 15, 2017 at 11:16

    Is not working. Look at the pics:

    Your code in Styling > Custom css:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_3.jpg
    And nothing:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_4.jpg

    Mayby I will should add php code to framework/theme-functions.php ???

    Regards

    #177656 Copied Theme version: 4.12 WooCommerce version: 3.2.3
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 15, 2017 at 11:18

    Please check symbols in your code http://prntscr.com/hapmlk > http://prntscr.com/hapmsb

    Regards

    #177657 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 15, 2017 at 11:52

    Uff. It’s working:) Thanks.

    But only if I am not registered or logged. If I logged icon disappears! Look:

    Before login:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_5.jpg

    After:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_6.jpg

    It is possible to add whan I’m logged? Can I use other icon like fa-user-o (<i class=”fa fa-user-o” aria-hidden=”true”></i>) from Font Awesome?

    1) Login or Register/My Account could be bigger like 14px? No it’s to small?

    2) Login or Register/My Account may have a different color like #0b1fba not typical grey?

    Regards

    #177660 Copied Theme version: 4.12 WooCommerce version: 3.2.3
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 15, 2017 at 13:07

    Hello,

    Change the previous code to:

    .login-link:before {
    content: "\e1000";
    font-family: 'xstore-icons';
    position: absolute;
    left: -10%;
    color: #0b1fba;
}
.top-links {
    font-size: 14px;
}

    to change the icon use http://prntscr.com/haqz3o as content value in code http://prntscr.com/haqz8y

    Regards

    #177663 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 15, 2017 at 14:42

    Thank you for your help:)

    1. It’s better, but there is a correct code:

    }.login-link:before {
    content: “\e1000”;
    font-family:’xstore-icons’;
    position: absolute;
    left: -8%;
    top: 1%;
    color: #0b1fba;
    }
    .top-links {
    font-size: 14px;
    }

    2. Still REGISTER/LOGIN has a grey color.
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_7.jpg

    I tried use this code, but not working :

    }.login-link:before {
    content: “\e1000”;
    font-family:’xstore-icons’;
    position: absolute;
    left: -8%;
    top: 1%;
    color: #0b1fba;
    }
    .top-links {
    font-size: 14px;
    color: #0b1fba;
    }

    2. And I can’t change icon type still! Is not working!

    3. Before logging in I see icon:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_7.jpg

    After logging in I don’t see icon:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_8.jpg

    It is possilbe add icon after logging in?

    4. The icon could be bigger like 14px? Login/Register has 14px, but icon is to small (on the left side). Just like that:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_7.jpg

    Regards

    #177675 Copied Theme version: 4.12 WooCommerce version: 3.2.3
    Avatar: Gry4you
    Gry4you
    Participant
    November 15, 2017 at 14:45

    …After logging in I don’t see icon:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_8.jpg

    It is possilbe add icon after logging in?

    Maybe this code should work? What do you think?

    if ( is_user_logged_in() ) {
    $user=wp_get_current_user();
    $name=$user->display_name; // or user_login , user_firstname, user_lastname

    Regards

    #177676 Copied Theme version: 4.12 WooCommerce version: 3.2.3
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 15, 2017 at 15:02

    Hello,

    2. To change color use this code:

    .top-links .links a {
    color: #0b1fba !important;
}

    to change size you may change value in this code http://prntscr.com/hash84, because the icon inherit font size from .top-links

    And I can’t change icon type still! Is not working!

    – oh I see, please use

    font-family: FontAwesome;
content: "\f007";

    instead 

    content: "\e1000";
font-family: 'xstore-icons';s';

    http://prntscr.com/hasn3s
    3. Yes, it is possible, but to give you the appropriate code I need your wp-admin access.
    4. The icon inherit font size from .top-links, so change the size value in this code http://prntscr.com/hash84.

    Regards

    #177678 Copied
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 15, 2017 at 15:15

    Try to add to this code http://prntscr.com/hasv4b .top-bar .my-account-link:before, like http://prntscr.com/hasvlv

    Regards

    #177679 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 15, 2017 at 16:25

    Wow. You are amazing:)

    It almost done, but before logging in has a perfect size and and position, look at:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_10.jpg

    After logging in is to close, look at:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_11.jpg

    I tried to change position, but it works both side.

    Thank you very much for your help. This is my code:

    }.top-bar .my-account-link:before, .login-link:before {
    content: “\f007”;
    font-family: FontAwesome;
    font-size: 18px;
    position: absolute;
    left: -6%;
    top: -4%;
    color: #0b1fba;
    }

    .top-links .links a {
    font-size: 15px;
    color: #0b1fba !important;

    }

    #177691 Copied Theme version: 4.12 WooCommerce version: 3.2.3
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 15, 2017 at 16:28

    Please also add this code:

    .top-bar .my-account-link:before {
    left: -9%;
}

    Regards

    #177692 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 15, 2017 at 16:36

    Yes, yes, yes….. Thank you a lot.

    This is a perfect code:

    .top-bar .my-account-link:before, .login-link:before {
    content: “\f007”;
    font-family: FontAwesome;
    font-size: 18px;
    position: absolute;
    left: -6%;
    top: -4%;
    color: #0b1fba;
    }

    .top-bar .my-account-link:before {
    left: -12%;
    top: -3%;
    }

    .top-links .links a {
    font-size: 15px;
    color: #0b1fba !important;
    }

    Best Regards
    Damian

    #177694 Copied
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 15, 2017 at 16:41

    You’re welcome!
    Great. Let us know if you need any further assistance.

    Regards

    #177696 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 15, 2017 at 16:55

    I have two more problems!

    1. If I would like to use “Header text color/Top bar text color” I can use only Dark and White. This is only one way? Can I use different color like #0b1fba or the other?

    2. Active window like here:
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_12.jpg

    When I enter the window, a green background appears. I will try to make a change in WP Bakery, but there is only active-block (In Inner Column Settings/General) that can’t be changed!
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_13.jpg
    https://gry4you.com/wp-content/uploads/2017/11/Icon_XStore_14.jpg

    I want white or blue background after I will enter the window!

    Maybe Y have a idea?

    Regards

    #177701 Copied Theme version: 4.12 WooCommerce version: 3.2.3
    Avatar: Olga Barlow
    Olga Barlow
    Participant
    November 15, 2017 at 17:53

    Hello,

    1) Unfortunately, we don’t have such option. It’s possible to implement by custom CSS only if you provide me temporary access to your Dashboard I can help you with this.

    2) Edit your page and page styles http://prntscr.com/hav9r7

    Regards

    #177711 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 16, 2017 at 09:33

    It,s ok. Thank you for help.

    Regards

    #177756 Copied Theme version: 4.12 WooCommerce version: 3.2.3
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 16, 2017 at 09:48

    You’re welcome!

    Regards

    #177764 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 17, 2017 at 12:41

    Hi,

    I would like to change the store page like here:
    https://gry4you.com/wp-content/uploads/2017/11/XStore_change_1.jpg

    I would like to use several different store pages like PS4, PS VITA or PS VR, where I can add product from a specific category like PS4 etc.

    Could you tell me, how to change main store page?

    Regards

    #177900 Copied Theme version: 4.13 WooCommerce version: 4.2.4
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 17, 2017 at 13:34

    Hello,

    You may set Shop page in WooCommerce > Settings > Products > Display > Shop page.
    Read more – https://docs.woocommerce.com/document/configuring-woocommerce-settings/

    Regards

    #177909 Copied
    Avatar: Gry4you
    Gry4you
    Participant
    November 17, 2017 at 13:56

    Thank you:)

    #177911 Copied Theme version: 4.13 WooCommerce version: 3.2.4
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 17, 2017 at 14:03

    You’re welcome!
    This topic will be closed because the issue is solved. Please kindly open up new tickets for additional questions.

    Regards

    #177913 Copied

  • Tagged: , , , ,

  • Viewing 27 results - 1 through 27 (of 27 total)

The issue related to '‘User Icon to My Account’' has been successfully resolved, and the topic is now closed for further responses

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder
Coffee Store – WordPress WooCommerce Theme
lazy-placeholder
Drinks Store – WordPress WooCommerce Theme
lazy-placeholder
Carwash – WordPress WooCommerce Theme
lazy-placeholder
Niche Market 02 – Multivendor WP WooCommerce Theme
lazy-placeholder
Lawyer – WordPress WooCommerce Theme
lazy-placeholder
Pub – WordPress Theme
lazy-placeholder
Web Agency – WordPress WooCommerce Theme
lazy-placeholder
Agricultural Store – WordPress WooCommerce Theme
lazy-placeholder
Handmade Store – WordPress WooCommerce Theme
lazy-placeholder
Flowers Store – WooCommerce Theme

See All Templates

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.