Geçtiğimiz günlerde
@tolgauc; arkadaşımız
Vue.JS ile Youtube mp3 dönüştürücü kodlamış ve ücretsiz paylaşmıştı. Bu kodları subdomain yada ayrı bir klasörde yayınlamak yerine WordPress sayfa içerisine gömerek kullanmak istedim. İlk olarak iframe kullanarak yapmak istedim ancak scroll bar görünmesi ve tam oturmaması nedeniyle alternatif yol aradım. WordPress konusunda ileri düzey değilim ancak birkaç kaynağı araştırarak yaptım.
@tolgajan; arkadaşımızın teşviğiyle paylaşmak istiyorum.
Sayfasının son görünüm hali için
YouTube MP3 Dönüştürücü sayfasını ziyaret edebilirsiniz.
- İlk olarak ana başlıktaki çeviricinin html dosyalarını GitHub'dan indiriyoruz. Ardından, indirdiğimiz klasördeki index.html dosya ismini youtube-mp3.php olarak değiştirerek tema klasörüne atıyoruz. (Siz istediğiniz ismi verebilirsiniz.)
Navbar'a ihtiyaç olmadığından ben
<body> etiketinden sonra
<!-- Arama Kısımları--> bölümüne kadar, aşağıdaki kodları sildim.
<nav class="navbar is-dark" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<div class="navbar-item">
<span class="navbar-item has-text-white">Youtube MP3 Downloader</span>
</div>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
</nav>
Sonra, tema klasörümüzün ana dizinininde
mp3-page.php adında bir dosya oluşturuyoruz. WpBegginer kaynağından aldığınız WordPress özel sayfa oluşturma kodlarını veya kullandığınız temanın
page.php dosyasını kopyalayarak içerisinde değişiklik yapıyoruz.
<?php get_template_part( 'content', 'page' ); ?> olan satırdaki
'content' kısmını,
'youtube-mp3.php' olarak değiştiriyoruz. Benim sayfa kodlarım aşağıdaki gibi.
Üstnot: Tema bileşenleri görünümde kayma yarattığı için
<?php get_sidebar(); ?> satırını kaldırdım.
<?php /* Template Name: Mp3 */ ?>
<?php get_header(); ?>
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<?php
// Start the loop.
while ( have_posts() ) : the_post();
// Include the page content template.
get_template_part( 'youtube-mp3', 'page' );
// If comments are open or we have at least one comment, load up the comment template.
if ( comments_open() || get_comments_number() ) {
comments_template();
}
// End of the loop.
endwhile;
?>
</main><!-- .site-main -->
</div><!-- .content-area -->
<?php get_footer(); ?>İşimiz bitti sayılır. Normal bir sayfa ekler gibi WordPress Admin panelden sayfa ekliyoruz. Sayfa Özellikleri > Şablon bölümünden de mp3 seçiyoruz. Hepsi bu kadar.