SVG konusunda yaşanan bir sorunu ve çözümü yazmaya çalışacağım bunun yanında bilmediğim bazı şeyler var onları da size sormak istiyorum.
Öncelikle eklenti kurmayı sevmiyorum, genelde child tema üzerinden işlem yapmayı seviyorum.
Sorunum nedir onu yazayım. Genelde fonksiyon dosyasına ekleyeceğimiz birkaç kod sayesinde wordpress sitesine svg dosyalarını upload edebiliyoruz.
Burada paylaşmıştım https://www.r10.net/sorum-var/310632...-svg-izni.html
Şimdi biz tüm temalarda var bu özelleştirmeden headere logo eklediğimiz zaman SVG boyutlandırması olmadığı için Google insight sorun çıkarıyor.
Yukarıdaki kodu aktif ettiğiniz zaman Wordresse dosya yükleniyor ama o svg ne kadar boyutta olduğu yazmıyor SVG 1800x1800 olsa bile dosya verisinde wordpress onu görmüyor.
1) SVG support eklentisini kurunca ne svg yüklerseniz yükleyin wordpress o svg kodlamasından kaça kaç yani viewBox kısmından sanıyorum bulup gösteriyor.
Dosya adı: kt_01_background_image.svg
Dosya türü: svg
Dosya boyutu: 76 KB
Ölçüler: 2000 × 2000
şeklinde ölçüleri gösteriyor. Bunu nasıl yapıyor merak ediyorum. Üst kısımda fonksiyon dosyasına eklenen dosyalarla svg atınca bunu belirtmiyor ve headere dosya yükleyince boyut göstermiyor. Aslında bu çok gereksiz gibi çünkü konu içine svg ekleyince sağda boyutlama çıkıyor bu sorun sadece header logoda baş gösteriyor. SVG support nasıl bunu algılıyor merak ediyorum.
2) Şimdi arkadaşlar ben bir şekilde çözüm buldum tema kodlaması ile biraz oynayıp header logo satırına width height girmeye çalıştım onuda şurdan yaptım.
kullandığım temada şöyle bir sayfa var:
BURADA önemli kısım şurası
/**
* Output custom logo
*
* @param string $option_string the image option id string
* @param string $custom_class the image custom class.
*/
function render_custom_logo( $option_string = '', $custom_class = 'extra-custom-logo' ) {
$html = '';
if ( empty( $option_string ) ) {
return;
}
$custom_logo_id = kadence()->option( $option_string );
// We have a logo. Logo is go.
if ( $custom_logo_id ) {
$custom_logo_attr = array(
'class' => 'custom-logo ' . $custom_class,
'loading' => false,
);
/*
* If the logo alt attribute is empty, get the site title and explicitly
* pass it to the attributes used by wp_get_attachment_image().
*/
$image_alt = get_post_meta( $custom_logo_id, '_wp_attachment_image_alt', true );
if ( empty( $image_alt ) ) {
$custom_logo_attr['alt'] = get_bloginfo( 'name', 'display' );
}
$type = get_post_mime_type( $custom_logo_id );
if ( isset( $type ) && 'image/svg+xml' === $type ) {
$custom_logo_attr['class'] = 'custom-logo ' . $custom_class . ' svg-logo-image';
}
/*
* If the alt attribute is not empty, there's no need to explicitly pass
* it because wp_get_attachment_image() already adds the alt attribute.
*/
$html = wp_get_attachment_image( $custom_logo_id, 'full', false, $custom_logo_attr );
} elseif ( is_customize_preview() ) {
// If no logo is set but we're in the Customizer, leave a placeholder (needed for the live preview).
$html = '<img class="custom-logo"/></a>';
}
/**
* Filters the custom logo output.
*
* @param string $html Custom logo HTML output.
* @param string $option_string the ID of the logo option.
*/
echo apply_filters( 'kadence_extra_custom_logo', $html, $option_string ); /* phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped */
}
/**
* Output custom logo
*
* @param integer $blog_id the site ID for multisites.
*/
function custom_logo( $blog_id = 0 ) {
$html = '';
$switched_blog = false;
if ( is_multisite() && ! empty( $blog_id ) && get_current_blog_id() !== (int) $blog_id ) {
switch_to_blog( $blog_id );
$switched_blog = true;
}
$custom_logo_id = kadence()->option( 'custom_logo' );
// We have a logo. Logo is go.
if ( $custom_logo_id ) {
$custom_logo_attr = array(
'class' => 'custom-logo',
'loading' => false,
);
/*
* If the logo alt attribute is empty, get the site title and explicitly
* pass it to the attributes used by wp_get_attachment_image().
*/
$image_alt = get_post_meta( $custom_logo_id, '_wp_attachment_image_alt', true );
if ( empty( $image_alt ) ) {
$custom_logo_attr['alt'] = get_bloginfo( 'name', 'display' );
}
$type = get_post_mime_type( $custom_logo_id );
if ( isset( $type ) && 'image/svg+xml' === $type ) {
$custom_logo_attr['class'] = 'custom-logo svg-logo-image';
}
/*
* If the alt attribute is not empty, there's no need to explicitly pass
* it because wp_get_attachment_image() already adds the alt attribute.
*/
$html = wp_get_attachment_image( $custom_logo_id, 'full', false, $custom_logo_attr );
} elseif ( is_customize_preview() ) {
// If no logo is set but we're in the Customizer, leave a placeholder (needed for the live preview).
$html = '<img class="custom-logo"/></a>';
}
if ( $switched_blog ) {
restore_current_blog();
}
/**
* Filters the custom logo output.
*
* @since 4.5.0
* @since 4.6.0 Added the `$blog_id` parameter.
*
* @param string $html Custom logo HTML output.
* @param int $blog_id ID of the blog to get the custom logo for.
*/
echo apply_filters( 'kadence_custom_logo', $html, $blog_id ); /* phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped */
}
/**2 tane custom logo kolonu var burda
İlk kısımdaki yere
// We have a logo. Logo is go.
if ( $custom_logo_id ) {
$custom_logo_attr = array(
'height' => 50,
'width' => 50,
'class' => 'custom-logo ' . $custom_class,
'loading' => false,
);girince çalışmadı yani site kodlarına bakınca herhangi bir width height satırı gelmedi ama2ci kısımda olan
/**
* Output custom logo
*
* @param integer $blog_id the site ID for multisites.
*/
function custom_logo( $blog_id = 0 ) {
$html = '';
$switched_blog = false;
if ( is_multisite() && ! empty( $blog_id ) && get_current_blog_id() !== (int) $blog_id ) {
switch_to_blog( $blog_id );
$switched_blog = true;
}
$custom_logo_id = kadence()->option( 'custom_logo' );
// We have a logo. Logo is go.
if ( $custom_logo_id ) {
$custom_logo_attr = array(
'height' => 50,
'width' => 50,
'class' => 'custom-logo',
'loading' => false,
);Buraya multi site diye geçiyor neden anlamadım ama buraya girince kod çalıştı. neden ilk kısımda çalışmadı bilmiyorum.
Belki daha kolay bir kodlama ile bu yapılabilir bilmediğim için ben bu yolu uyguladım. Direk function.php dosyasına kod eklenilerek yapılabilir heralde.
mesela direk function.php dosyasına
add_theme_support('custom-logo', array(
'width' => 180,
'height' => 180,
));
ekleyince hiçbirşekilde çalışmadı.
Sizle paylaşmak istedim.
Svg support nasıl direk boyutları algılamasını sağlıyor bunu merak ediyorum ve sadece ehader logo için fonsyon dosyasına ne kullanırsam height width ekler acaba?
Teşekkürler