Baru-baru ini, ramai pentadbir laman web melaporkan bahawa selepas menggunakan sistem Dreamweaver untuk menjana fail tags.php, mereka mendapati reka letak halaman tidak teratur, selang antara tag tidak konsisten, malah ubah bentuk berlaku. Masalah ini sebenarnya berkaitan dengan kod tags.php yang disertakan dengan sistem DreamWeaver, dan kami perlu mengoptimumkannya.
Langkah pertama: Ubah suai helaian gaya
Dalam fail tags.php yang disertakan dengan sistem DreamWeaver, helaian gaya dibentangkan dalam bentuk jadual Kaedah reka letak ini boleh dilakukan dengan mudah menyebabkan teg ke Selang antara mereka tidak teratur, mengakibatkan susun atur halaman yang tidak sedap dipandang dan malah kandungan bertindih. Kita boleh menggunakan kaedah susun atur DIV+CSS dan mengubah suai kod helaian gaya seperti berikut:
.tagcloud { margin: 0; padding: 0; font-size: 14px; line-height: 24px; text-align: justify; } .tagcloud a { display: inline-block; margin: 0 5px 5px 0; padding: 4px 10px; background-color: #f2f2f2; border-radius: 3px; color: #666; text-decoration: none; -webkit-transition: color .2s linear, background-color .2s linear; transition: color .2s linear, background-color .2s linear; } .tagcloud a:hover { background-color: #3498db; color: #fff; }
Langkah 2: Ubah suai kod PHP
dalam fail tags.php untuk paparan Kod daripada teg adalah seperti berikut:
$tagsql = "SELECT tag,counts FROM `#@__tagindex` WHERE tag!='' ORDER BY counts DESC"; $dsql->SetQuery($tagsql); $dsql->Execute();
Kod ini sebenarnya membaca maklumat teg daripada pangkalan data sistem DreamWeaver, dan kemudian menyusunnya mengikut kekerapan penggunaan teg untuk paparan. Walau bagaimanapun, kod ini tidak mengendalikan jarak antara teg, mengakibatkan masalah reka letak halaman. Kita boleh menambah pembolehubah $i pada kod untuk merekodkan bilangan gelung, dan kemudian melaraskan jarak antara label berdasarkan nilai $i Kod adalah seperti berikut:
$tagsql = "SELECT tag,counts FROM `#@__tagindex` WHERE tag!='' ORDER BY counts DESC"; $dsql->SetQuery($tagsql); $dsql->Execute(); $i = 1; while($row = $dsql->GetArray()) { $tagname = $row['tag']; $counts = $row['counts']; if($i == 1) { echo ""; } echo "".$tagname." (".$counts.")"; if($i % 10 == 0) { echo ""; } $i++; if($i > 100) { break; } } if($i > 1) { echo ""; }
Dalam diubah suai kod, Kami menambah teg DIV pada permulaan gelung untuk membalut keseluruhan awan teg, dan kemudian mengawal gaya setiap teg mengikut nilai $i, termasuk lebar, tinggi, jidar luar, jidar dalam, dsb., dengan itu merealisasikan pelaksanaan pelarasan selang. Kerana setiap baris boleh memaparkan sehingga 10 label, kami menambah label DIV untuk mengosongkan apungan apabila $i ialah 10, 20, 30...
Langkah 3: Optimumkan kod HTML
Selepas mengubah suai kod PHP, kita juga perlu mengoptimumkan kod HTML untuk menjadikan reka letak halaman lebih cantik. Kami boleh mengubah suai kod HTML dalam fail tags.php untuk memaparkan awan teg dalam bekas yang berasingan, yang boleh mengawal saiz, kedudukan dan reka letak awan teg dengan berkesan. Kodnya adalah seperti berikut:
<div class="tagcloud-wrapper"> <h3>标签云</h3> <?php // PHP 代码 ?> </div>
Kod ini akan memaparkan awan teg dalam bekas DIV bernama tagcloud-wrapper Kami boleh mengoptimumkan bekas dalam helaian gaya untuk mencapai hasil yang lebih baik.
Ringkasnya, dengan mengubah suai lembaran gaya, kod PHP dan kod HTML, kami boleh menyelesaikan kekeliruan reka letak dan masalah gaya yang disebabkan oleh fail tags.php yang dihasilkan dalam sistem DreamWeaver dengan berkesan. Awan teg yang dipertingkatkan bukan sahaja lebih cantik, tetapi juga lebih mudah untuk diindeks oleh enjin carian, meningkatkan kesan pengoptimuman enjin carian tapak web.
Atas ialah kandungan terperinci Apakah yang perlu saya lakukan jika tags.php yang dijana oleh DreamWeaver diformatkan secara tidak betul?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!