ម៉ឺនុយ​នៅ​ក្នុង​ផ្នែក​គ្រប់គ្រង​មាន​ទីតាំង​ខុស​គ្នា​ពី​ម៉ឺនុយ​នៅ​ផ្នែក​ខាង​មុខ ពីព្រោះ​យើង​​បាន​កំណត់​យក​ទីតាំង​ផ្នែក​កៀន​ខាង​ឆ្វេង​សំរាប់​ម៉ឺនុយ​នៅ​ក្នុង​ផ្នែកគ្រប់គ្រង​។ រូបភាព​និង​ចំណងជើង​នៅ​ក្នុង​ម៉ឺនុយ​នេះ គឺ​សំរាប់​ចុច​បើក​ទំព័រ​បង្កើតទិន្នន័យ​ឬ​ upload ឯកសារ និង​កំណត់​ចំនួន​នៃ​ការផ្សាយ​នៅ​ទំព័រ​ខាង​មុខ​។ យើង​នឹង​បង្កើត​ទំព័រ​សំរាប់​តំណរភ្ជាប់​នៅ​ក្នុង​ម៉ឺនុយនេះ ជា​បណ្តើរ​ៗ​នៅ​ពេល​ខាង​មុខ​នេះ។

 

<!--src/layouts/admin/Menu.astro-->
---
---

<section class="md:w-1/4 w-full p-3 bg-teal-100">
    <div class="">
        <div class="grid grid-cols-[45px_auto] items-center gap-x-3 gap-y-4 
        font-display text-[16px] text-gray-600">
            <a href="/amin" class="hover:opacity-75">
                <img class="" src="/images/movie.png" />
            </a>
            <a href="/admin" class="hover:opacity-75 w-full">
                ការផ្សាយ
            </a>

            <a href="/amin/page" class="hover:opacity-75">
                <img class="" src="/images/page.png" />
            </a>
            <a href="/admin/page" class="hover:opacity-75">
                ទំព័រ​ស្តាទិក
            </a>

            <a href="/amin/category" class="hover:opacity-75">
                <img class="" src="/images/category.png" />
            </a>
            <a href="/admin/category" class="hover:opacity-75">
                ជំពូក
            </a>

            <a href="/amin/upload" class="hover:opacity-75">
                <img class="" src="/images/upload.png" />
            </a>
            <a href="/admin/upload" class="hover:opacity-75">
                Upload
            </a>

            <a href="/amin/user" class="hover:opacity-75">
                <img class="" src="/images/users.png" />
            </a>
            <a href="/admin/user" class="hover:opacity-75">
                អ្នក​និពន្ធ
            </a>

            <a href="/amin/setting" class="hover:opacity-75">
                <img class="" src="/images/setting.png" />
            </a>
            <a href="/admin/setting" class="hover:opacity-75">
                Setting
            </a>
        </div>
    </div>
</section>

 

<!--src/layouts/admin/Base.astro-->
---
const { pageTitle="ទំព័រ​គ្រឹះ" } = Astro.props
import Footer from "../Footer.astro"
import Header from "./Header.astro"
import Menu from "./Menu.astro"
---

<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width" />
        <meta name="generator" content={Astro.generator} />
        <title>{pageTitle}</title>
        <link rel="icon" href="/images/siteLogo.png" />
        <link href="/fonts/setup.css" rel="stylesheet" />
        <script is:inline src="/scripts/jquery.js"></script>
    </head>
    <body class="text-sm leading-normal">
        <Header pageTitle={pageTitle}/>
        <div class="max-w-5xl mx-auto flex md:flex-row flex-col mt-5 md:px-0 px-2">
            <Menu/>
            <slot/>
        </div>
        <Footer/>
    </body>
</html>

 

Netlify: https://khmerweb-dynamic-blog.netlify.app/admin

GitHub: https://github.com/Sokhavuth/dynamic-blog