Σ Sigma Hosting is mainly a video tutorial website

Σ Sigma Hosting is mainly a video tutorial website that make it easier for you to search within the transcript of videos for solutions of problems you might face during your journey in dealing with different webhosting companies. So, we are very sorry if the text is not well organized and we may work on it in the future but for now we hope you get the benefit mainly from the video then you may need to have a look on the transcript. Thanks for your understanding 🙂

earlier this week I was asked how on my website on my services page how I was able to create this accordion-like effect in Wix when Wix currently does not offer an accordion like option a dedicated accordion like option through their editor and the answer is using wix's FAQ app so kind of go and jump in right into the editor so here we start with a blank template we have our home screen so what we want to do is go to more scroll all the way down and hit that Wix FAQ button so this is going to add the initial basic FAQ setting right into your website but it doesn't put it in your home page it actually creates an entirely different FAQ what page within your site so we'll just simply rename it to services you can feel free to remain it to whatever you wanted to but this is what it will be viewed as from now on in your navigation bar so from here you now have your web page with your accordion that you want it on you must know that if you want to put an accordion feature on your web page you need to create the page FAQ initially you cannot create the page and then input wix's FAQ into it you cannot copy paste or cut and paste this Wix FAQ into another page you need to initially go about it the way that I'm doing it and create the Wix FAQ first and then do your design features on this page afterwards so knowing that we're going to jump right into editing which is FAQ to a more stylish clinical services accordion as I have it on my page so we're just going to right click hit settings and right off the bat you can see there are four design features that you can have your layout look like so we're just going to keep it on the initial basic one the classic and then we're going to jump straight to the Settings tab you can see they got a couple check marks to hide and show both the title and the magnifying glass so we're just going to click those off for right now and then but we're going to leave the social icons checked and you'll see those pop up here shortly when we start messing with the settings and previewing it but we'll jump into the design tab and this is where you change the colors the font and so forth within the FAQ itself so what we're going to do we'll just try to make it relatively look like the one that's on my site we'll just give it a simple red color the question will give it a red color and we'll give the and we'll keep the answered black so we're just going to leave it like that so let's now go into editing our question and also our answers quote-unquote of the FAQ so we're going to go to the manage questions button click that and this is where you do all your editing so with wix's FAQ you don't have to upgrade to utilize it you get for free sorry seven free questions sections of the accordion or FAQ before you need to upgrade if you have more options that you want and still on this specific web page but we're just going to say we have less than seven we're just going to stick to the four we're really only can edit one for this exercise so click on the question that we want to edit with the pencil edits I'm in here will change the question – I'll just go back to our business we'll just call it business package for now and then we'll go down here and this is where you type the text that will show once you click on the accordion-like feature so we're just going to type in a couple options so we got the mountain we now we have the text so let's say we want to add an image like what I have on my page that links to my contact page so in order to do that first we want to know where we want to put it within the accordion drop-down excuse me so what you want to make what you want to know is that wherever you place your cursor in the text assuming you have multiple line text in your answer is where the picture is going to end up so if you want it high on your answer page answer section you want to have your cursor and on the top row if you want to put it all the way at the bottom you want your cursor at the bottom on the last line so let's say we want to put it as high up as possible on answers so we're going to click up on the roll one and we're going to insert an image so we're going just going to pick one of my contact buttons that I created from my original website hit apply and as you can see it places it right in the middle and it separates the text so to fix that or just click on the image itself and I'm here you can see it's on the middle button so that separates the text but we want word wrap so you can either word wrap it on the left side but what we want to do is even it out so we're going to put on the right side so we're going to keep it on the right one and we're going to want to link it to another page and since home is our only other page we're just going to link it to our home page but which and then you can also add alt text so you can simply just put contact pricing and hit enter so before you hit this check mark to make it okay and then to preview to make sure everything is all good you want to get rid of the space so this space is automatically going to be included when you insert your image so in order to do that you'll want to click in space and simply just hit delete to hit save that sometimes I've noticed that if you go back it'll keep the space there but just hit delete don't hit backspace and it'll get rid of that little space so we're going to go back and we're going to preview this really quick so if we go to preview and business package boom there we go and again here are your social media icons that we left checked and that's show up at the bottom of each of your answers and we have our image that we inserted that is linked as a button to our home page and we just clicked on the home page so now we are looking at a blank web page but let's just go back to services and that is more or less how you create the accordion effect within Wix using which is FAQ app let me know if you have any questions feel free to contact me I'm all ears thank you yes .

Video Discription

Learn how to create an accordion menu in WiX! Currently, WiX does not support a dedicated accordion menu design option but by utilizing the WiX FAQ app we can create an accordion menu feature!

Feel free to visit the Services page on my website, www.nine19webdesign.com, to view my implementation of it.

 

Leave a Reply