Forum for discussing general topics related to Couch.
5 posts Page 1 of 1
Hi,

I created 2 snippet templates for ember

Header.html and Footer.html

I embed them both on my index.php

But for some reason only 1 template is showing which is footer
but if I remove the footer.html in the snippets folder then the header template will show.

It seems that it only allow 1 template on the snippet folder?

I need help please
Hi,

It seems that it only allow 1 template on the snippet folder?

No, that is not correct; you may have any number of snippets embedded on the same page.

Could you please post the code you are using?
KK wrote: Hi,

It seems that it only allow 1 template on the snippet folder?

No, that is not correct; you may have any number of snippets embedded on the same page.

Could you please post the code you are using?


Hello @KK Thanks!

I have figured it out.

Basically, I embed the header snippet and footer snippet on the index.php
and if I add any editable in those snippets it will automatically show on the index template

What I was doing was creating templates for each of the header snippet and footer snippet by adding the PHP couch tags which is wrong. It turns out any embed on the snippet will be inherited from the main template.


My issue now is I am using index.php also as the BLOG list. The Index.php I call HOME template has the editable for the footer and header snippets. Now, I want to make it cloneable because I need it for the blog list on the index.php but then it will also show the editable for the footer and header snippets.


Below is my CODE:




Code: Select all
<?php require_once( 'couch/cms.php' ); ?>
<cms:template title='Home' />

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Welski's Blog</title>
    <link rel="stylesheet" href="../welski/css/styles.css">
    <link rel="stylesheet" href="../welski/css/responsive.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>

<body>

    <div class="container">
        <cms:embed 'header.php' />

        <main>
            <div class="categories">
                <ul>
                    <li><button>Uncategorized</button></li>
                    <li><button>Category 1</button></li>
                    <li><button>Category 2</button></li>
                </ul>
            </div>

            <div class="blogRoll">
                <article>
                    <img src="../welski/img/img.jpg" alt="">

                    <div class="blogDetails">
                        <h2>This is a blog Item</h2>
                        <p>April 05, 2024 | Category</p>
                        <p>This is an excerpt</p>
                        <button><a href="../welski/single.html">Read More...</a></button>
                    </div>
                </article>

                <article>
                    <img src="../welski/img/img.jpg" alt="">

                    <div class="blogDetails">
                        <h2>This is a blog Item</h2>
                        <p>April 05, 2024 | Category</p>
                        <p>This is an excerpt</p>
                        <button><a href="../welski/single.html">Read More...</a></button>
                    </div>
                </article>

                <article>
                    <img src="../welski/img/img.jpg" alt="">

                    <div class="blogDetails">
                        <h2>This is a blog Item</h2>
                        <p>April 05, 2024 | Category</p>
                        <p>This is an excerpt</p>
                        <button><a href="../welski/single.html">Read More...</a></button>
                    </div>
                </article>
            </div>
        </main>
       
        <cms:embed 'footer.php' />
    </div>

</body>
</html>
<?php COUCH::invoke(); ?>


Header snippet
Code: Select all
       
        <header>

        <cms:editable name='logo' type='group' />
            <img src="<cms:editable name='logo_image' width='100' height='100' type='image' order='-2' group='logo' />" alt="<cms:editable name='alt' label='Logo Alt Tag' type='text' order='-1' group='logo' />">
       

            <div class="social">
                <ul>
                    <li><a href=""><i class="fa-brands fa-facebook icon"></i></a></li>
                    <li><a href=""><i class="fa-brands fa-square-instagram icon"></i></a></li>
                    <li><a href=""><i class="fa-brands fa-twitter icon"></i></a></li>
                </ul>
            </div>
           
            <div>
           
            </div>

            <p class="bio"><cms:editable name='bio' type='text' /></p>

            <nav class="navbar">
                <ul>
                    <li><a href="">Home</a></li>
                    <li><a href="">Blog</a></li>
                    <li><a href="">Contact</a></li>
                </ul>
            </nav>
        </header>


Footer Snippet
Code: Select all
<footer>
    <cms:editable name='footer_text' desc="This is your footer content." type='richtext'>
        <p>Copyright 2024 - Welski's Blog</p>
    </cms:editable>
</footer>



Here is the problem.
If I make this index as clonable also: (because the index is the blog list as well)
It will include the editable parts for the header and footer snippets which doesn't make any sense
I just need the editable for the blog list.
Please see upload attachment

Attachments

Could you please take a look at the '2. Template globals' section in viewtopic.php?f=5&t=11105 ?
That is the way to define editable regions that do belong to a particular template but do not show up in all its cloned pages.

Hope this helps. Let me know.
Good Morning!

Though KK Sir has replied your query, but if you would want to understand a cleaner approach, please connect to us, here.

Regards,
GXCPL (CTR)

welski wrote:
KK wrote: Hi,

It seems that it only allow 1 template on the snippet folder?

No, that is not correct; you may have any number of snippets embedded on the same page.

Could you please post the code you are using?


Hello @KK Thanks!

I have figured it out.

Basically, I embed the header snippet and footer snippet on the index.php
and if I add any editable in those snippets it will automatically show on the index template

What I was doing was creating templates for each of the header snippet and footer snippet by adding the PHP couch tags which is wrong. It turns out any embed on the snippet will be inherited from the main template.


My issue now is I am using index.php also as the BLOG list. The Index.php I call HOME template has the editable for the footer and header snippets. Now, I want to make it cloneable because I need it for the blog list on the index.php but then it will also show the editable for the footer and header snippets.


Below is my CODE:




Code: Select all
<?php require_once( 'couch/cms.php' ); ?>
<cms:template title='Home' />

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Welski's Blog</title>
    <link rel="stylesheet" href="../welski/css/styles.css">
    <link rel="stylesheet" href="../welski/css/responsive.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>

<body>

    <div class="container">
        <cms:embed 'header.php' />

        <main>
            <div class="categories">
                <ul>
                    <li><button>Uncategorized</button></li>
                    <li><button>Category 1</button></li>
                    <li><button>Category 2</button></li>
                </ul>
            </div>

            <div class="blogRoll">
                <article>
                    <img src="../welski/img/img.jpg" alt="">

                    <div class="blogDetails">
                        <h2>This is a blog Item</h2>
                        <p>April 05, 2024 | Category</p>
                        <p>This is an excerpt</p>
                        <button><a href="../welski/single.html">Read More...</a></button>
                    </div>
                </article>

                <article>
                    <img src="../welski/img/img.jpg" alt="">

                    <div class="blogDetails">
                        <h2>This is a blog Item</h2>
                        <p>April 05, 2024 | Category</p>
                        <p>This is an excerpt</p>
                        <button><a href="../welski/single.html">Read More...</a></button>
                    </div>
                </article>

                <article>
                    <img src="../welski/img/img.jpg" alt="">

                    <div class="blogDetails">
                        <h2>This is a blog Item</h2>
                        <p>April 05, 2024 | Category</p>
                        <p>This is an excerpt</p>
                        <button><a href="../welski/single.html">Read More...</a></button>
                    </div>
                </article>
            </div>
        </main>
       
        <cms:embed 'footer.php' />
    </div>

</body>
</html>
<?php COUCH::invoke(); ?>


Header snippet
Code: Select all
       
        <header>

        <cms:editable name='logo' type='group' />
            <img src="<cms:editable name='logo_image' width='100' height='100' type='image' order='-2' group='logo' />" alt="<cms:editable name='alt' label='Logo Alt Tag' type='text' order='-1' group='logo' />">
       

            <div class="social">
                <ul>
                    <li><a href=""><i class="fa-brands fa-facebook icon"></i></a></li>
                    <li><a href=""><i class="fa-brands fa-square-instagram icon"></i></a></li>
                    <li><a href=""><i class="fa-brands fa-twitter icon"></i></a></li>
                </ul>
            </div>
           
            <div>
           
            </div>

            <p class="bio"><cms:editable name='bio' type='text' /></p>

            <nav class="navbar">
                <ul>
                    <li><a href="">Home</a></li>
                    <li><a href="">Blog</a></li>
                    <li><a href="">Contact</a></li>
                </ul>
            </nav>
        </header>


Footer Snippet
Code: Select all
<footer>
    <cms:editable name='footer_text' desc="This is your footer content." type='richtext'>
        <p>Copyright 2024 - Welski's Blog</p>
    </cms:editable>
</footer>



Here is the problem.
If I make this index as clonable also: (because the index is the blog list as well)
It will include the editable parts for the header and footer snippets which doesn't make any sense
I just need the editable for the blog list.
Please see upload attachment
Image
where innovation meets technology
5 posts Page 1 of 1
cron