Through our trade link with Chinavasion we can offer you some of their best selling current products at incredibly lows prices. Check these out:
​

This week I have been working with Alice of Auckland offering consultancy and website editing on the Vida Essence website. The challenge was to design and implement a Booking System and Buy Now buttons for the range of health and healing services offered by Vida Essence. I had been approached to do this work as a New Zealand Weebly website professional. While the Vida website was well developed on Weebly's 'Business' (ecommerce) platform, it was not quite working as desired.

Value Websites regularly provides online registration and payment forms for various conferences, conventions, forums and other institutional gatherings.

Two forms currently live relate to the July SCANZ Convention to be held in Wellington and the August Myeloma Summit planned for Queenstown. In addition to gathering contact information these forms offer various registration categories, social function attendance and accommodation booking. A feature of the SCANZ form is its provision of hidden fields which are activated when a trigger field is clicked. For instance, if a partner registration is required then further fields appear. This provides cleaner form appearance.

Once the required information is gathered, amounts owing are calculated and displayed and the GST component is indicated. When these forms are 'Submitted' two things happen. A copy of the registration information is auto-sent via email to the form email address provided (as well as of course to the conference organisers) and a PayPal payment screen appears. Payment from a PayPal account or Credit Card is invited. Alternatively, those preferring an invoice have been instructed to exit at this point.

These forms have been individually designed and mirror manual (PDF) forms that are available for those who are not yet ready to do their registering and paying online.

Typically, depending on complexity and number of fields required, Value Websites provides this service for $300-$500 per event.

Launched as a New Zealand website design and development company in 2008, Value Websites are now in their sixth year of operation. In six years the web has developed exponentially. Early in our development we began our partnership with the Weebly Content Management System (CMS) that had been launched a year before we were formed. Today, more than 90% of our web work relates to one of the Weebly websites that we manage. We humbly claim to be New Zealand Weebly experts and are often called upon by businesses and individuals to either build a Weebly web for them or to troubleshoot one that they have begun.

During 2014, Weebly have expanded very significantly, offering a new range of options and services as they seek to tune their system for the modern web. You can read about some of these  developments in this BLOG POST.

The Weebly System now ranks with the big players on the web. Whether it is a small business basic brochure website you need, an online registration and payment site linking with Formstack and PayPal (or other add-ons) or a full-blown eCommerce website, Weebly with Value Websites is a great choice for you if you need a professional, value-for-money and easy-to-work-with website developer.

All of our websites come with Blogging options and a built-in interface to easily connect to major social media.

If it is prompt, value-for-money, personalised service you want from your NZ Weebly website professional then call Terry on 027 600 1926 or use our Webform. 

Today I would like to demonstrate how I create breadcrumbs link trails in my Weebly websites. I have seen a few others try this but without complete success. I am indebted to Jack Woon's blog article on this subject and I use the Javascript code he used adding some refinements to his code and methodology.

This is the code I use in this website to setup Breadcrumbs.

You can copy the code above by saving the weeblybreadcrumbs.js file below to your Weebly Code Editor Files directory accessible via: DESIGN > Edit HTML/CCS > Files

There are a few variations to this code available to those of us who are not experienced Javascript coders. For instance:

• <h4>...</h4> could be <h3>...</h3> if you want a larger font size.
• "You Are Here: " can be changed  or deleted.
• UpperCase can be changed to LowerCase - there are three places where this change can be made.
• <font color="#555555"> (towards the bottom of the above code - this controls the font of the page name you are on) can be changed to any color code you wish as long as it contrasts with your page content background.

Having loaded the .js file above, you need to add code to your HTML pages above your Files folder.

The secret to creating Weebly Breadcrumb Trails is to treat each top level menu link in conjunction with the sublinks above (or beside) it.  

With reference to this website www.valuewebsites.co.nz for instance, I have grouped 'Web Services' with the sublinks below beginning with 'Weebly Websites'. In this case I have used the same Page layout for all these links, 'short-header.html'

Just above the closing </body> tag I have inserted this script.
<script src="/files/theme/weeblybreadcrumbs.js"></script> 

The final piece of code that needs to be added is placed immediately above  the {content} code (usually white) on the html page.
<div topurl="/Web-Services.html" toptitle="Web Services" ></div>
So 'topurl' in this case is '/Web-Services.html' and the top level page's title 'toptitle' is 'Web Services'

Now, this is where it all gets a little more complicated. Some Weebly users will need help with this. Each top level link, in my websites e.g. 'About Us', 'VW News', etc. needs to have a different Page Layout. If you want to use the same graphical design and page layout as 'short-header.html' for another top level menu link, you will need to copy the html code in that layout and create another page layout, e.g. 'short-header2.html'. I have done that for my 'About Us' page. I then changed the 'div' (2nd) red code above to:
<div topurl="/About-Us.html" toptitle="About Us" ></div>
while adding the 'script' (1st) code as is.

Furthermore, you may choose to have No Header for the sub link/s below (beside) a Top Level Link, as I have done for the pages below 'About Us'. Please do not use the 'no-header.html' Page Layout - this is needed for Store Products/Services if you need your website for eCommerce.

Copy the code from your existing 'no-header.html' page and create, 'no-header2.html' before adding in:
<div topurl="/About-Us.html" toptitle="About Us" ></div>
<script src="/files/theme/weeblybreadcrumbs.js"></script> 
as above.

And so on....

You will need to Publish your website to see your Breadcrumbs Trail - it does not appear when you are in Editing mode.

Three things to note:

1. You may choose not to have a breadcrumb trail on your Home page, or any other page that does not have menu sub-links. If you do have a 'Trail' on Home, you need to act in the same way as above because 'Home' is a top level menu link just like 'About Us' and 'Web Services' on this website.
   
2. If you have products for sale, your eCommerce 'Cart' is a 'no-header.html' page like the Product pages. Your 'Cart' breadcrumb trail 'Store' or 'equivalent' link may throw up a 404 error message. I have not figured how to get around this. Suggestions are welcome.
3. I have tried to offer a careful explanation of how to add breadcrumb trails to Weebly websites. Those of you unfamiliar with using html and javascript code may be encouraged to try implementing this breadcrumbs methodology. Don't waste too much time if your time is valuable. In most cases I can add this code to your Weebly website in less than an hour. You may choose to spend NZ$50 with me to have the code installed on your Weebly website.

Jack Woon also offers an alternative method which involves coding page by page. This is okay if there are say less than 15 pages in your website. Beyond that it becomes tedious and time consuming. As you develop your website it may also be frustrating to have to manually change or add code as you add new pages and/or change top level links, etc.
Alternative Method
Load the .js file as above to the 'Files' folder. 
Add the first code once at the bottom of one of your page footer elements:
<script src="/files/theme/weeblybreadcrumbs.js"></script> 
This code will automatically repeat on the footer of all pages.
Add the second code, adjusted for each of the top level menu links, to each web page, eg.:
<div topurl="/About-Us.html" toptitle="About Us" ></div>
For this alternative method top (2nd) code:

1. You can use the element Copy function to more quickly move the top level link code to the top of sub-menu pages;
   
2. You can add the code to the RH sidebar of any 'Blog' page - not top left;
   
3. You can add the code to your Store page, but you will not be able to place  it in Product pages nor in the Checkout Cart.

To view the results of coding using this alternative method visit our sister website Edit Your Webs

Please use the comments facility associated with this Post if you have questions or suggestions about this topic. 

May all your breadcrumbs be tasty ones!

Terry Alve
Value Websites

Last week we did a review of Shopify Online Store Builder which we had been using on behalf a client for the first time. We had been spending time search engine optimising a tyvek wristbands site. It is pleasing to see that some of the search terms we optimised for are beginning to show up already on the first page of Google. Some of these shows are directly related tot he article we published here last week - one of the values of using this blog software!

Today, we want to return to the eCommerce builder we are more familiar with: Weebly and our own Designer Version we have on www.edityourwebs.com domain. This week much of our time has been spent upgrading www.louknzclothing.co.nz who are our major eCommerce client. In particular in addition to adding new products, we have been working on inventory. It had become apparent that some product variations were out-of-stock. So we are working with our client to make sure that where stock is unavailable or in transit, no one can order and pay for product that cannot be delivered promptly. At this point it is a customer relations issue.

We are also working with this client preparing to issue their first online eNewsletter. We have their client elist on Mail Chimp and are currently reviewing content, including a bonus reward for those on their list. If you visit their site, now might be a good time to join their elist. Whether we will use the Coupon redemption component of the software is undecided but that feature is there if needed. Either way there will be a subscriber benefit out within the week.

While we have talked about this website before in this eNews, you may enjoy visiting to see how it has developed nearly six months on from launch.