problems with text in shop layout

  • 1
  • Question
  • Updated 5 years ago
  • Answered
Hi Guys

I'm having some real problems with the shop widget. I have included a screenshot to help explain.

The way the text that comes with the store (see red circled text) seems to have been placed almost at random in the shop widget, on most sites I would expect to find things like a log in link or a search near the top of the page and set to one side. Is there a way that this can be moved or even edited, are there alternate fonts?

Whilst these features may look OK if the ecwid generated store is going to make up the whole of your page, but they begin to look quite ridiculous if you have a large banner, header or title above them as the log in search and category text begin to be pushed further down the page. It would be so much easier if these pages were editable. At the moment I have the feeling that I'm going to be stuck with a store that does not match the feel of the rest of my site or at best one that can only be edited with either knowledge of CSS or HTML
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
  • miserable

Posted 5 years ago

  • 1
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Kenny

Thank you for your feedback on the layout options of Yola Online Store. The elements you circled by a red line can be customized by editing the Store CSS. You can access the Store CSS like this:
  1. Open your Online Store Control Panel.

  2. Click on "System Settings" in the top-right corner.

  3. Click on "Design".

  4. Create a new CSS Theme.

  5. Add code edits (CSS overrides) to the first box.

  6. Save.

Here is some code you may be interested.

By editing this code you can set a particular font for your whole Yola Online Store:
.ecwid div, .ecwid span, .ecwid a, .ecwid p {


font-family: NAME_OF_FONT !important;

}

This code determines the properties of the Sign In element, such as the position or the alignment:
/* 'Sign In' or 'Hello,  Sign Out' labels at the top of the product browser */

div.ecwid-productBrowser-auth {
position: relative;
text-align: right;
margin: 7px;
}

If you need assistance with concrete edits you have in mind, please share them with us on this thread, and we'll check if we can find a code for you that works.

Can you please explain again what you mean when you say that the log in search and category text begin to be pushed further down the page if you have a large banner, header or title above them? A screenshot to illustrate the problem would be excellent for me to understand this better. Thanks.
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
Hi stefan

thank you for the reply I will take a look at changing the css today attached is a screenshot which I hop will help explain what I meant i about the text being pushed down the screen
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
This may be a little better.....
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
I also find that I am having problems publishing my site to my domain.

The domain is now being pointed at yola (I can see this when I type my domain into a browser as i am told it is pointing at yola) however when I click the publish button I don't get the option:

"Already own a domain?" section, click on "Point your domain now".
.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Without knowing your domain name, it may mean that it isn't completely pointed. This anomaly can happen when only one A record is set up.
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Kenny

Thank you for the screenshots, I now understand what you mean. The categories menu, sign in element, and the drop down menu are part of the Online Store Widget. It's therefore not possible to separate these elements to position anything in between them and the rest of your online store. I'd suggest that you create your online store page in a way that your Online Store Widget can be positioned as high above on the page as possible, maybe as the first widget on the top. I think that from a design perspective, it should be fine if the structure of your Online Store page is a bit different from the rest of your pages. The main thing is that your Online Store is positioned as high up as possible. Even if you were able to add banners or other things between the Sign In element and the rest of your store, your store with the first pictures of your products would still be pushed down on the page, and you may want your visitors see the pictures at once, no matter how big the screen is they use.

I'm afraid I'm not yet able to answer your question about your domain because I could only find a Yola Free account without domain and online store by using your forum e-mail address. Can you please post your login e-mail address to the relevant Yola account (not your password) for me to assist you further with this?
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
Hi Stefan

my log in email address is jadesdaddy@live.co.uk
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Sorry, Kenny, and of course I'd need to know your domain name. Could you also post it here? Thanks.
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
domain name is paperless-books.co.uk
Photo of Laura Thomas

Laura Thomas, Social Media Coordinator

  • 4536 Posts
  • 211 Reply Likes
Hi Kenny,

As Gop and Stefan mentioned, I only see one A record set up for your domain. For your domain to be published to Yola you need 2 A records pointing to 184.72.229.176.
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
Hi Laura

I'm really confused by all of this. I followed the instruction given to me by Stefan as the yola tutorial for pointing domains from Go Daddy is so out of date, and when I type my domain into a browser I am shown a Yola place holder that tells me my domain is being pointed at Yola!

What exactly do I need to do to rectify this problem?
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
This screen shot illustrates the A record settings, outlined by red boxes that you need for a GoDaddy domain to point to Yola's servers.



Once that is done and has propagated across the web, then login to your My Yola and Select the domains tab. In that tab scroll down to "Want to keep your domain registered with another registrar?" and click on the arrow head on the Left Hand Side of that statement.

Within the exploded view of that section you can then type the name of your (GoDaddy) domain into the open box. Now select the (Yola) site file you wish this pointed domain to be associated with. Click "Add"
Photo of Boomer

Boomer, Champion

  • 2055 Posts
  • 84 Reply Likes
Hi Kenny,

If you are getting the the Yola place holder, this is great! It means that your domain is being pointed at Yola and there's nothing else to do on GoDaddy. All you need to do now is publish your site to the domain name in the Sitebuilder.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Unfortunately there is only one active A record and this can give an erroneous message that it is pointed ready to publish..
Photo of jeremy

jeremy, Employee

  • 1349 Posts
  • 90 Reply Likes
Hi Gop,

While we advise you have 2 A records to point your domain to Yola, you can also do it with one A record and one CNAME pointing to 184.72.229.176. The nature of a CNAME means it will work too if configured as Kenny did above.

We actually have the steps here: https://www.yola.com/tutorials/articl...

This issue was most likely one of a propagation lag.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
OK thanks Jeremy. I hadn't re-checked.

The Yola tutorial however for the GoDaddy navigation is outdated which is what Kenny had mentioned. Once inside the DNS management it remains the same.
Photo of jeremy

jeremy, Employee

  • 1349 Posts
  • 90 Reply Likes
Thanks Gop!

We will check it out and make the necessary changes. These domain hosts change their systems so frequently and sometimes we don't get to it fast enough.

Thanks again for the information.
Photo of Boomer

Boomer, Champion

  • 2055 Posts
  • 84 Reply Likes
Hi Kenny,

The domain paperless-books.co.uk is pointed correctly. You can publish your site :)
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
Hi Boomer

I thought that my domain name was pointed correctly as yesterday I had the yola place holder but no option on yola (when clicking publish) to use my own domain name.

However, today when I type my domain name into my browser I get a 504 gateway timed out .....the server did not respond in time message. Is this a problem with Yola or with Go Daddy?
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Kenny

Your website is now up and running under paperless-books.co.uk. Congratulations! Please let me know should you encounter any problems.

If you can't access your live site, please first try to clear your cache and cookies.
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
Hello Stefan

thanks for letting me know, however the congratulations may be a bit premature, I just had a look at the site and it seems I have lost my shopping bag from it so although you can click a buy it now link there seems no way to check out!!
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Kenny

Thank you for bringing this to our attention. It's related to the Super Flat Style you use, and our developers will look into a general solution.

Your Minicart element has actually always been there, but was covered by the background of Super Flat. In order to resolve this, I can offer you a workaround, using a CSS code to add to your Site CSS Editor. It is possible that this workaround causes design issues with your Super Flat Style, and if you should encounter such issues, please let us know and we'll find a solution for you.

For now, please follow these steps:
  1. Copy this code:
    #sys_background {
    
    z-index: 0;
    }

  2. Go to your Yola Sitebuilder and click on the "Site" tab.

  3. Click on "Content".

  4. Click on the "Site CSS" icon.

  5. The Site CSS Editor opens. Paste the code into the left-hand side box.

  6. Save.

  7. Preview your Online Store and put a product into your shopping bag. You will see that the minicart element now appears.

If you have any questions, please let me know.
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
Thanks for that Stefan

but really it's not a big deal as I noticed that the shopping bag is there when you click a link to read a description. However, what I do find a problem is that when you do click a link to view a description the item who's link you have clicked is added immediately to the shopping bag. This means that a customer has to empty the shopping bag of all items that they may have looked at but don't necessarily want to buy, that would really annoy me if I was looking at links on a site.

BTW what is a super flat style?
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Super Flat is the name of the Style Template you use for your Yola website.
Photo of Kenny

Kenny

  • 140 Posts
  • 3 Reply Likes
Hi again Stefan

the code you sent worked great and also solves the problem with a link click adding to the bag :-)
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
I'm very happy to hear that, Kenny. Let me know if you have more questions.