WebSite X5Help Center

 
Hans R.
Hans R.
User

Additional Image In The Menu Column  en

Autore: Hans R.
Visite 3439, Followers 1, Condiviso 69  

I would like to position an image in the menu column (vertical menu).
I already used the possibility of the image in the definition of the template.
I tried an HTML element in the header with a <div>-element with aboslute positioning.

How can I add things in the menu-column, specifically an image or text around the defined menu?

Postato il
15 RISPOSTE - 1 UTILE
Incomedia
Claudio N.
Incomedia

Hello Hans,

Actually the software does not support the custom code in the menu column. Using a div with position=absolute as CSS can solve your problem.

Leggi di più
Postato il da Claudio N.
Hans R.
Hans R.
User
Autore

I did add a div with absolute positioning in the header (to position in the menubar). It does not work. The image disappears behind the menu bar.

Where do I place the HTML to position the DIV-element?

Leggi di più
Postato il da Hans R.
Incomedia
Claudio N.
Incomedia

I think you simply have to use a z-index on your div. Use one higher than 10200 to put your object above the menu graphics.

Leggi di più
Postato il da Claudio N.
Hans R.
Hans R.
User
Autore

Unfortunately it doesn not work:

<div style="top: 0px; left: 10px; position: absolute; z-index=10201">
<img src="img.jpg" alt="Coverimage" height="191" width="116">
</div>

This gives an image covered by the (vertical) menu.

Leggi di più
Postato il da Hans R.
Hans R.
Hans R.
User
Autore

To continue on this, the generated code is given below. There is the DIV i created in the header HTML but it is enclosed in a DIV of the HTML element used for my own DIV element which containes the image. The image can not be displayed in the menu colum this way. Any other suggestion?

<div style="position: absolute; top: 1px; left: 2px; width: 100px; height: 100px; overflow: hidden;">
<div style="top: 10px; left: 10px; position: absolute; z-index: 11000; overflow: visible">

<img src="C:\\Users\\Gebruiker\\Documents\\Websites\\NNS\\Images\\9090186352_frontcover_thumb.jpg" alt="Coverimage" height="191" width="116">

</div>
</div>


Leggi di più
Postato il da Hans R.
Incomedia
Claudio N.
Incomedia

Try using some JavaScript. Just add an html object to the header and paste this code:

<script>
var html = "<img src=\"relative_path_to_the_image\" alt=\"Coverimage\" height=\"191\" width=\"116\">";

$(document).ready(function() {
$("#imMnMn").after(html);
})
</script>

Of course you should write the correct path to the image. In example: "files/image.jpg" and then upload your image in the "files" folder.

Leggi di più
Postato il da Claudio N.
Derek Tutill
Derek Tutill
User

Works a treat for me.  Don't suppose you have a bit of code to add to it so that you can embed a link through the image to either a page within the web site or alternatively to an external web site.  Cheers

Leggi di più
Postato il da Derek Tutill
Hans R.
Hans R.
User
Autore

Unfortunately it doesn't work for me. Don't know why. I do not get any errormessages, no picture is shown. It is getting way to difficult.

I want to mimic www.nietnaarsantiago.nl in the websiteX5 tools but that seems to be very difficult because:

1) I can not place objects at will in the menu section.
2) I can not manipulate borders, colors of the sections easily.

Any better suggestions? Coding internally into the tool I do not see as a good solution.

Thanks.

Hans

Leggi di più
Postato il da Hans R.
Incomedia
Claudio N.
Incomedia

Hi Hans,

Make sure that the path to the image is correct and it's correctly uploaded on your server.

Thank you!

Leggi di più
Postato il da Claudio N.
Hans R.
Hans R.
User
Autore

It is all done, image in rootdir.

Code: <script>
var html = "<img src=\"frontcover.jpg\" alt=\"Coverimage\" height=\"0\" width=\"0\">";

$(document).ready(function() {
$("#imMnMn").after(html);
})
</script>

Checked and double checked.

Does not work, sorry.

Leggi di più
Postato il da Hans R.
Hans R.
Hans R.
User
Autore

Two additional remarks:

  1. the height / width have been played with, I see things move right of the menu in the main textbody.
  2. maybe the image in the main text part is in front of the picture?
Leggi di più
Postato il da Hans R.
Incomedia
Claudio N.
Incomedia

Hi Hans,

If that does not work on your site, there's no way to add an image under the menu. The menu column can be quite complex as there are blocks used for CSS styles and other blocks used only for content.

The last try could be add a z-index higher than 10000 to your image.

Leggi di più
Postato il da Claudio N.
Hans R.
Hans R.
User
Autore

That a pity.

You may add this as a wish for a subsequent version.

Leggi di più
Postato il da Hans R.
Incomedia
Claudio N.
Incomedia

Would you open an "idea" post describing exactly how you want this feature to be added in WSX5?

If there's a certain number of users interested in it, we can add it in a future release.

Thank you!

Leggi di più
Postato il da Claudio N.