Retina ready on Icon menu

Front page Support Forums Ikebana Theme Support Retina ready on Icon menu

Tagged: ,

This topic contains 3 replies, has 2 voices, and was last updated by  satori 2 years, 10 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #2212


    Hi, people from Satori studio. First of all, congrats for your awesome theme.

    There it goes my question: How to upload and use icons retina ready on the icon menu?
    I tried uploading .png at double than usual dpi, as you explained on your instructions, but in retina displays those icons still looking awful.
    What you explained on the theme manual works fine with images for posts, but i couldn’t find the way to apply it to icon menu.
    Any clue?

    And now a suggestion for future updates: A sticky header and/or icon menu would be fantastic!
    Any easy way to getting it by adding some custom CSS?

    Kind regards.



    Hey Rafa,

    first of all, thank you for the purchase!

    you’re right, it’s an issue indeed – the theme’s script only recognizes and replaces images within the normal “img” html tags, not background images. I did add a mechanism to circumvent that for portfolio item backgrounds, yet no such fix exists for the icon menu yet. It will require some programmatic changes to the theme, but so far here’s an easy fix you can try to implement:
    1). make the icon menu images twice as large as you need them to be on normal (non-retina) displays; make sure that the image files are of the same dimensions each (ideally – squares).
    2). upload these images to the respective icon menu items in the “Icon Menu” tab of the theme options panel;
    3). apply this CSS (you can add it inside the “Style: Add Custom CSS” tab of the theme options panel:
    #iconmenu .icons-item { background-size: 50%; }

    You can adjust the background-size figure until the icons are of the size you want on the non-retina displays (as long as it is less than 50%).

    Andrii / Satori Studio



    Thank you Andrii, this solution will work by now. Such an excellent customer service!
    Actually i wanted to add two different sizes to the menu icon images for giving a nice effect, but as i told, will work as it is right now.
    Please, consider sticky header/menu for future updates!
    Thank you!



    Thank you for the feature proposition, Rafa! Added to my to-do list for version 2.2.

    Should you have more questions, do not hesitate to contact me!

    Andrii / Satori Studio

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.