[Eisenberg188]

It works with the example.

[xtom]

The latest version of Xara sometimes exports an extra div around placeholder code so you may need add extra <div> tags to the Footer Start placeholder as shown below.

Code: [Select]

</div></div><div class="footer"><div><div>

[sera49]

So
i have a question about the the tweak...

Generally it is working great - but i have a issue that dont know how to solve.... The dynamic content can be increased by pressing a button - it extends but the page stays as it is was...

example http://test.bus-express.at/

The page extends at loading... but pressing eg. BOOK TAXi - doesnt makes the page extend... If you refresh the page (F5) than everything is ok....

What coulb be the reason and is there any cure of the problem?

Thanks

[steved]

**Update**

These dynamic page tweaks for xara have been updated and now work with full width backgrounds on the pasteboard layer. In Xara just add the name htmlclass="footerBackground" to the highest footer object on your page and  to any footer objects that are not on your footer layer eg. footer backgrounds on the pasteboard layer.

The javascript is also now minified and compressed to be more efficient on your web page and the unminified source is also included should you need to modify it.

Just wondering if this is still meant to work with Xara Pro X 17? I am having all sorts of trouble and have followed all to tips and tweaks mentioned here.

Thanks in advance.

[xtom]

I've updated the tweak in the first post which should work in latest versions of Xara. I've tested and saved the xar file from Designer Pro v16 but it should work in v17 too.

[steved]

I've updated the tweak in the first post which should work in latest versions of Xara. I've tested and saved the xar file from Designer Pro v16 but it should work in v17 too.

Thanks for the reply. I still had no luck so loaded your .xar as a new project, renamed index to default, created three simple articles, ended up removing the "extras" on the example page and still no luck. I tried it with and without the extra <div></div>.

This is such a great tweak and something I'd really like to use for a NFP group I am doing a website for.

[steved]

A bit of an update with this one. Here's an actual article page. It extends for the page, but not the comments section. First is from the standard example, 2nd is with the extra </div> then <div>

I am seriously looking at buying the Developer version of this, which may also lead to individual licences for those who aren't hosted on my server.

[xtom]

First thing to check is if the tweak works when previewing in your version of Xara.

So download and open the example tweak file afresh and in the content placeholder replace {page_content} with lots of paragraph tags like below code example.

Code: [Select]

<div class="my_d_content" style="width:100%; position:absolute;">
<p>test</p><p>test</p><p>test</p><p>test</p><p>test</p>
<p>test</p><p>test</p><p>test</p><p>test</p><p>test</p>
<p>test</p><p>test</p><p>test</p><p>test</p><p>test</p>
<p>test</p><p>test</p><p>test</p><p>test</p><p>test</p></div>
After you replace this code click the preview page button in Xara.

Does the page extend and footer move down to accommodate all the test paragraphs? Or is it not working even in the preview?

If it doesn't work when previewing in Xara you might need to change the number of divs in the Footer Start placeholder as described. But let me know what happens when you just preview in Xara and we can troubleshoot further.

[xtom]

OK I just found a small bug that will prevent the tweak from working if you publish it onto a https website.

In the HTML code (head) section for the Footer Start placeholder make sure the link to the jquery file starts with https:// and not http:// otherwise the browser will treat the file as insecure and if your website is https it will block the file from loading. It should be as below..

Code: [Select]

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
Although when using with the CMS you should replace this with the template tag {jquery} - this is how I normally use it and didn't notice the problem with the old link to the google hosted jquery file.

I've updated the tweak download file in the first post with this fix.



 

[sera49]

Hi Xtom,

will really appreciate your help -

"... The page will extend automatically when it loads but you can also make it extend after it loads by using class="extend_page" - when any element with this class is clicked on it will extend the page. This can be useful for forms that show hidden content on the page after load. You can change this class name and the trigger event itself in the javascript code by editing the head code in the Footer Start placeholder...."

Can you please specify how this should be done? Thank you very much!

[xtom]

Hi sera, basically you just assign that class name to an element and then when you click on that element it will extend the page. For example the checkout page in the CMS uses it, so when you click the radio box to specify a different delivery address it displays extra fields on the page for this and because the radio box has class="extend_page" it extends the page, of course the tweak must be present in the page template. You can check it over on the Xara+CMS demo at https://demo.xt-cms.com/xara/store/ - just add a product to cart and click through to the checkout page.

This is the HTML below for the radio box on the checkout page and you can see how it has class="extend_page"

Code: [Select]

<input type="radio" name="seperate_delivery_address" value="1" class="extend_page" onclick="javascript:show('delivery_details');">
So when this radio button is clicked it will show the extra fields for the delivery address and also extend the page. So using just this class name on an element with the tweak should extend the page with a click. Of course the javascript to show the extra/hidden content will vary depending on what you are using but the tweak and class name should work independently to that.

If you wanted to add this class name to something in Xara you can apply the name htmlclass=extend_page using the apply name toolbar button or add it to custom HTML in a placeholder.