WebSite X5Help Center

 
Des M.
Des M.
User

Widgets  en

Author: Des M.
Visited 3737, Followers 3, Shared 0  

I would like to use compatible widget software within my websites to create Tabs, Accordions, etc. An early recommendation cited some time ago was http://jqueryui.com/

Is that still the best recommendated software or are there others alternatives particularly for ease of use and changing colour?

Posted on the
19 ANSWERS - 1 USEFUL - 1 CORRECT
Jamie B.
Jamie B.
User

Hi

we have various tutorials for accordions, toggles, tabs and sliders on http://www.x5tuts.com

regards

jamie

Read more
Posted on the from Jamie B.
Des M.
Des M.
User
Author

That site looks very helpful. Thanks

Read more
Posted on the from Des M.
Des M.
Des M.
User
Author

I have tried copying and pasting the Accordion code from http://www.x5tuts.com but I am not getting the correct result.

In the advanced settings / statistics, SEO and Code / expert section, I already have pasted Google analytic code. I've pasted the accordion code after the google code - would there there be a conflict?  

I've then pasted the second suggested code into the HTML code on a page. 

I'm attaching an image of the results from previewing the page.

Read more
Posted on the from Des M.
Anthony A.
Anthony A.
User

there is no conflict. its better to copy  the google code in "before closing body" section.

I am assuming you chose accordion set 4 v11, after doing step 1, on step 2 you need to remove the check mark inside your html object to show scroll

on step 3, when you adding those two files, remember to choose the right path! when you are adding js file, in path field type js and when you adding css file, in path field you need to type css.

or

you can leave them as it is and go back to step 1, the code that you copy paste,

original code

<!-- X5 Accordions CSS -->
<link type="text/css" rel="stylesheet" href="css/x5_accordion_toggle.css">
<!-- jQuery Library (skip this step if already called on page ) -->
<script type="text/javascript" src="js/jquery.min.js"></script> <!-- (do not call twice) -->
<!-- X5 Accordions JS -->
<script type="text/javascript" src="js/x5_accordion_toggle.js"></script>

replace it with this code


<link type="text/css" rel="stylesheet" href="files/x5_accordion_toggle.css">
<script type="text/javascript" src="files/jquery.min.js"></script>
<script type="text/javascript" src="files/x5_accordion_toggle.js"></script>

Read more
Posted on the from Anthony A.
Des M.
Des M.
User
Author

I've tried what you suggested but without success. I replaced the code with the bottom code and still no joy.

I think the problem lies in the advanced settings / statistics, SEO and Code / expert section - I'm attaching a screen shot of the coding.

Read more
Posted on the from Des M.
Jamie B.
Jamie B.
User

Hi

did you add the files in the html widget. Make sure they are in the correct folders as well.

regards

jamie

Read more
Posted on the from Jamie B.
Jamie B.
Jamie B.
User

All the tutorials have been tested on v9, v10 & v11 and they all work.

regards

jamie

Read more
Posted on the from Jamie B.
Des M.
Des M.
User
Author

Jamie

Did that again, same result!

Read more
Posted on the from Des M.
Anthony A.
Anthony A.
User

can you upload your website so we can see it live?

Read more
Posted on the from Anthony A.
Jamie B.
Jamie B.
User

Hi right after looking through your site it seems like the files are not on the server you need to add a html widget then add your files like the image attached

Read more
Posted on the from Jamie B.
Jamie B.
Jamie B.
User

Anthony

if you look at his source code and click on the files, you'll agree with me that there not on his server correct.

regards

jamie

Read more
Posted on the from Jamie B.
Des M.
Des M.
User
Author

Jamie

Thanks for your help. Unfortunately I can't find the fills required to be uploaded as I don't know what I am looking for - the tutorial is not explicit or helpful.

I've been trying widgets from http://www.x5tuts.com and I find them more user friendly and easier to install in the website.

Des

Read more
Posted on the from Des M.
Jamie B.
Jamie B.
User

In the project files downloaded you will find the Css and js files required, all you do is add them in the required folders in the code. Is it Evo 11 or pro 11 that your using.

Read more
Posted on the from Jamie B.
Des M.
Des M.
User
Author

Evo 11

Read more
Posted on the from Des M.
Anthony A.
Anthony A.
User

Yes Jamie, I see that

Des, follow these steps

1) go to advance settings>statistic>expert tab and remove the codes and files

2) download the zip file attached to this message

3) extract the zip file

4) add the following 3 files "x5_accordion_toggle.css" & "jquery.min.js" & "x5_accordion_toggle.js", IMPORTANT: while adding them place a checkmark on "Link the file"

5) add all the image files, IMPORTANT: while adding image files, change the "Path on server" from "files" to "images"

6) go back to your page and hit the preview

Done!

Read more
Posted on the from Anthony A.
Jamie B.
Jamie B.
User

Anthony

thanks very much, Des if you follow the instructions above you shouldn't have any problens, if you do I will gladly add the files to your project for you.

regards

jamie

Read more
Posted on the from Jamie B.
Des M.
Des M.
User
Author

Thanks very much, I got that sorted. If I want to setup other widgets (Tabs) I presume it is a similar process in downloading the files? Is there a download button on the website?

Thanks again.

Des

Read more
Posted on the from Des M.
Jamie B.
Jamie B.
User

Hi des

all the tutorials come with project files, just click on the box at the bottom of the tutorial.

regards

jamie

Read more
Posted on the from Jamie B.