3 comments found

Hi! Great theme! I absolutely love it and I want to thank you so much for making such a beautifully crafted wordpress theme.

I have only one question so far…

Is there any way I can use an SVG image for my logo? I don’t like how it doesn’t look crisp and clean on mobile devices.

I look forward to your help.

Thank you!!! ~Jen

DeliciousThemes

Hi Jen,

I`m very happy that you like my theme.

Regarding your question, the theme offers support for retina devices. In order to have a clean, crisp logo for the website, you need to create a version of the logo, 2 times bigger, than the original one. If your current logo is 150×40px, the new one has to be 300×80px.

Then you need to rename it like so: if the current logo is named logo.png, the retina version logo should be named logo@2x.png

Then you need to upload the retina logo on the same folder where the current logo is(very likely, inside wp-content/uploads/2014/03/).

That`s it. Now, when you`ll open the website on a mobile phone, the theme will serve the retina version of the logo(make sure to clear browser`s cache in case you don`t see the change immediately).

Because the theme is working with the width and height values of your logo and because svg files aren`t supported natively by WordPress, you can`t use an svg file for the logo at this moment.

Let me know how it goes.

Thank you! Madalin

Monkeyjar

Thanks Madalin!

It’s a bummer wordpress doesn’t support svg’s. Is there any way I can just disable the entire header part? I’m not going to use it for anything but to display my logo and I can work around that if I just removed that header. :)

Thank you so much, and thanks again for a great theme!

~Jen

Hello DT,

I’m tweaking Patti like it much, but I don’t manage bringing Google Maps Widget to work on Firefox yet. The widget works on Chrome, Safari without problems. When I tested in IE I noticed that Google Map is colored and not gray-scaled. So I thought about filter in css and found out that there’s a grayscale section in functions.php. After I commented that section out Firefox is showing a colored map. Which is okay for me but why does that css line not work in Firefox:

.map-wrapper [id^="google_map_"], .portfolio li a img, .team-member img.team-avatar, .post-masonry a img, .client-item img, iframe { filter: url("http://test.naturalflowyoga.de/wp-content/themes/patti/images/grayscale.svg#greyscale"); }

Do you have any idea?

Thank you, Michael

DeliciousThemes

Hi,

IE is a very not-so-web-dev-friendly browser. The technology that I use for the grayscale effect is not supported by all IE versions and that`s why you see the google map colored in it.

The problem that you have is actually related to your server, which doesn`t support .svg images. If you access the URL: http://test.naturalflowyoga.de/wp-content/themes/patti/images/grayscale.svg#greyscale , you get a few lines of text, instead of an image. This means that your server interprets svg files as text, rather than as images. (Check out my url: http://demo.deliciousthemes.com/patti/wp-content/themes/patti/images/grayscale.svg#greyscale – the page is blank but it`s actually displaying the grayscale.svg file).

To fix this problem, follow the solution from this comment: http://goo.gl/CZIjjI

Let me know how it goes!

Thank you!

Default-user

Hi back, thank you it works….

I added

AddType image/svg+xml .svg

to httpd.conf for making it global on the webserver.

So let’s state that Chrome and Safari recognize .svg as images without a properly set MIME-Type and Firefox doesn’t.

Well done! :-)

Hi, Great theme ! I love it . For the portfolio thumbnails on the homepage I’d just like to know how I can change the size of the title when I mousehover ? Is it possible to organise this text like for example : “Author – Composer – Musician” but on separates lines ? Many thanks Pierre

DeliciousThemes

Hi,

I guess you have the problem on Firefox.(in Chrome it should look ok).

This is a server-side issue. The grayscale effect uses an svg file which is not interpreted correctly by your server.

So, the grayscale effect for Firefox is generated by a line of code in style.css:

filter: url(images/grayscale.svg#greyscale); /* Firefox 4+ */

The way that servers are interpreting SVG files is “image/svg+xml”. Your server probably sees the SVG file as “text/plain”, aspect that makes it not working properly. The easiest way to fix this is through a .htaccess file.

This is a configuration file that is often hidden, so make sure to have the option for displaying hidden files active on your FTP software. If your server does not have such a file, create a file and name it ”.htaccess”. The line you should add inside .htaccess is:

AddType image/svg+xml svg

This hack should make the server see the svg file and interpret it correctly.

Let me know if it works!

Thank you! Madalin


by
by
by
by
by
by