• 23-04-2022, 06:26:05
    #10
    Riga adlı üyeden alıntı: mesajı görüntüle
    Tamam aslında yukarıda verdiğim örnekler bunların bir parçasıydı.

    Renk Seçimlerin kullanıcı taraflı olacağını düşünürsek.

    İçeriğin bir adet Box ( Kutu ) ve Kutunun içerisindeki bir yazı içeriğinden oluştuğunu düşünelim.

    custom.css dosyasını kullanıcının seçimine göre düzenlemeniz gerekir.

    Ancak default bir css dosyanız olacak, kullanıcı seçimleri yapmazsa. ( Opsiyonel )

    default.css

    .box
    {
        width:100px;
        height:100px;
        background:#000000;
    }
    .box_p
    {
        color:#ffffff;
    }
    Kullanıcı seçimlerini yapacak ve işleyecek sayfa

    custom.php

    <form action="#" method="post">
    <fieldset>
      <legend>Kutu Stil Ayarları:</legend>
      <label>Genişlik:</label>
      <input type="text" name="customs[class][box][width]" value="100px"><br><br>
      <label>Yükseklik:</label>
      <input type="text" name="customs[class][box][height]" value="100px"><br><br>
      <label>Arkaplan Renk:</label>
      <input type="color" name="customs[class][box][background-color]"><br><br>
      <label>Yazı Renk:</label>
      <input type="color" name="customs[class][box_p][color]"><br><br>
      <input type="submit" value="Güncelle">
    </fieldset>
    </form>
    <!--
    
    Kullanım Örneği
    
    customs[selector_type][selector_name][attribute]
    // # (id) için Örnek: customs[id][box][background-color]
    -->
    <?php
    
    if($_POST)
    {
        $custom_css = '';
        foreach($_POST['customs'] as $selector => $names)
        {
            $available_selectors = array('id','class');
            $replace_selectors = array('#','.');
            $selector = str_replace($available_selectors,$replace_selectors,$selector);
    
            foreach($names as $name => $attributes)
            {
                $completed_attributes = '';
                foreach($attributes as $attribute => $value)
                {
                    $completed_attributes.=''.$attribute.': '.$value.';';
                }
                $custom_css.=''.$selector.''.$name.' { '.$completed_attributes.' }'.PHP_EOL;
            }
        }
        
        /* Örnek Çıktı şöyle birşey olacaktır:
        .box { width: 100px;height: 100px;background-color: #000000; }
        .box_p { color: #ffffff; }
        */
        
        file_put_contents('custom.css',$custom_css);
    }
    ?>
    Site sayfası index.php ( Örnek )

    Zamanı bastırmamızın nedeni yapılan değişikliklerden sonra cachede kalmaması.

    <!DOCTYPE html>
    <html lang="tr">
    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
      <title>Default</title>
        <link rel="stylesheet" href="default.css">
        <link rel="stylesheet" href="custom.css?v=<?php echo time(); ?>">
    </head>
    <body>
    <div class="box"><p class="box_p">Merhaba hoşgeldin.</p></div>
    </body>
    </html>
    Bu yapıyla ister renk seçimi yaptırın ister genişlik, yükseklik v.b örnekleri geliştirmek size kalmış. Ben işi biraz daha geniş düşünerek hızlı şekilde yazdım kodları. Ben sizin için en iyi örnekleri verdim.

    Umarım başka arkadaşlarında işine yarar.
    İstediğim tam olarak bu ve ben php kısmını hallettim hocam . Sadece .Css dosyasına yazma izni vermemiz sorun yaratır mı?
  • 23-04-2022, 07:45:11
    #11
    ismail03 adlı üyeden alıntı: mesajı görüntüle
    İstediğim tam olarak bu ve ben php kısmını hallettim hocam . Sadece .Css dosyasına yazma izni vermemiz sorun yaratır mı?
    Artık tüm sunucularda yazma iznine gerek olmaksızın çalışması gerekli. Deneyin göreceksiniz.
  • 23-04-2022, 09:35:36
    #12
    Riga adlı üyeden alıntı: mesajı görüntüle
    Artık tüm sunucularda yazma iznine gerek olmaksızın çalışması gerekli. Deneyin göreceksiniz.
    Yardımlarınız için çok teşekkür ederim sorunum çözüldü ve cevabınıza istinaden R10+ verdim.
  • 23-04-2022, 09:46:04
    #13
    Eğer sınırsız bir denk değişimi istiyorsanız en basit ve kolay yol inline css. Herhangi bir sorun yaratmaz bu opsiyon.

    Diğer bir yol ise style.css dosyasını düzenleyip ilgili hex kodunu girmek, bu çok karmaşıklık oluşturur.

    Diğer, çok iyi olabilecek ve karmaşık yol ise ilgili seçeneklere göre baz alınan build sistemi. Buna karmaşık dememin sebebi konuyla alakası olmayan birinin kavraması zor kaçabilir. Ve genelde tercih edileceğini sanmam inline yolu varken.
  • 23-04-2022, 09:48:27
    #14
    canyucel adlı üyeden alıntı: mesajı görüntüle
    Eğer sınırsız bir denk değişimi istiyorsanız en basit ve kolay yol inline css. Herhangi bir sorun yaratmaz bu opsiyon.

    Diğer bir yol ise style.css dosyasını düzenleyip ilgili hex kodunu girmek, bu çok karmaşıklık oluşturur.

    Diğer, çok iyi olabilecek ve karmaşık yol ise ilgili seçeneklere göre baz alınan build sistemi. Buna karmaşık dememin sebebi konuyla alakası olmayan birinin kavraması zor kaçabilir. Ve genelde tercih edileceğini sanmam inline yolu varken.
    @Riga; beyin anlattığı gibi ona özel bir css dosyası oluşturup sadece o işlemleri yaptıracağım
  • 23-04-2022, 09:53:54
    #15
    ismail03 adlı üyeden alıntı: mesajı görüntüle
    @Riga; beyin anlattığı gibi ona özel bir css dosyası oluşturup sadece o işlemleri yaptıracağım
    Evet, o yol benim bahsettiğim 3. yola benziyor. Arkadaş tahmin ettiğimden basit şekilde özetlemiş 👏