He just said add this code!

Showcase
2

Add images into the SlideBarMenu

slidemenu
slidemenu389×595 302 KB

  1. get the Plug Bubble Plugin
  2. Add a When Page Load Action - Custom Code Block
  3. For each option in your SlideBarMenu you will need 1 block so here is the block and the example:

The Block:

var pb = $( "div.slideable-option:contains('THE-MENU-OPTION-TITLE')" ); $(pb).prepend('<img align="left" float="absolute" src="YOUR-IMAGE-URL" width="100%" height="100%" />');

The Example:

(I have 4 menu options named, Option 1, Option 2, Option 3, Option 4 & my image url is https://s3.amazonaws.com/appforest_uf/f1504722854619x869909093482419800/iconwhite.png):

The Finished Block Would Be:

var pb1 = $( "div.slideable-option:contains('Option 1')" ); $(pb1).prepend('<img align="left" float="absolute" src="https://s3.amazonaws.com/appforest_uf/f1504722854619x869909093482419800/iconwhite.png" width="100%" height="100%" />');

var pb2 = $( "div.slideable-option:contains('Option 2')" ); $(pb2).prepend('<img align="left" float="absolute" src="https://s3.amazonaws.com/appforest_uf/f1504722854619x869909093482419800/iconwhite.png" width="100%" height="100%" />');

var pb3 = $( "div.slideable-option:contains('Option 3')" ); $(pb3).prepend('<img align="left" float="absolute" src="https://s3.amazonaws.com/appforest_uf/f1504722854619x869909093482419800/iconwhite.png" width="100%" height="100%" />');

var pb4 = $( "div.slideable-option:contains('Option 4')" ); $(pb4).prepend('<img align="left" float="absolute" src="https://s3.amazonaws.com/appforest_uf/f1504722854619x869909093482419800/iconwhite.png" width="100%" height="100%" />');

Just make sure you copy them without the gaps to avoid issues, we did this for clarity.

4 Likes