CouchCMS Forum Bug Reporting and Troubleshooting
Problems, need help? Have a tip or advice? Post it here.
14 posts Page 1 of 2
Post a reply
Previous 1, 2 Next

events calendar category

avatar
IdealSolucoes
Registered User
Hello!

I'm with a doubt someone help me!

I created a calendar following the http://docs.couchcms.com/concepts/events-calendar.html documentation.

my question.

I need to create a calendar for each category.

each category have to have your calendar with their events.

categories will be created a button to click that button only show the calendar with the only event of the desired category.

it's possible?

Attachments

Re: events calendar category

User avatar
trendoman
Registered User
Yes it is possible to display month, week and day of some page. All you need it to use different formats for k_page_date as in http://docs.couchcms.com/tags-reference/date.html

Re: events calendar category

avatar
KK
Moderator
I need to create a calendar for each category.

Create each category as a Couch folder. Now you can use the 'folder' parameter with <cms:calendar> tag exactly the way you do with <cms:pages>.

If you are familiar with the 'views' in Couch (http://docs.couchcms.com/concepts/views.html), basically you need to implement the calendar in the 'folder-view' and that should do exactly what you wish.

Hope it helps.

Re: events calendar category

avatar
IdealSolucoes
Registered User
KK wrote:
I need to create a calendar for each category.

Create each category as a Couch folder. Now you can use the 'folder' parameter with <cms:calendar> tag exactly the way you do with <cms:pages>.

If you are familiar with the 'views' in Couch (http://docs.couchcms.com/concepts/views.html), basically you need to implement the calendar in the 'folder-view' and that should do exactly what you wish.

Hope it helps.



Code: Select all
<?php require_once( 'adm/cms.php' ); ?>
                <cms:template title='Agenda Pública' icon='graph' />        
                <!DOCTYPE HTML>
                <!-- BEGIN html -->
                <html lang = "en">
                <!-- BEGIN head -->
                <head>
                <cms:embed "css.php" />
                <cms:embed "js.php" />
                <style type="text/css">
table.calendar_small {
   width: 265px;
   height: 265px;
   font-size: 14px;
   font-family: 'Helvetica Neue', Arial, sans-serif;
   margin: 10px;
   border-collapse: collapse;
   border-spacing: 0;
}
table.calendar_small th {
   padding: 0;
   margin: 0;
   font-weight: bold;
   border-bottom: 1px solid #555555;
}
table.calendar_small td {
   padding: 0;
   margin: 0;
   width: 14%;
   text-align: center;
   vertical-align: middle;
   background-color: #FFFFFF;
   color: #222222;
   border: 1px solid #DDDDDD;
}
table.calendar_small td.months_heading {
   border-left: 0;
   border-right: 0;
   color: #555555;
   font-weight: bold;
}
table.calendar_small td.other_month {
   background-color: #EEEEEE;
   color: #999999;
}
table.calendar_small td.entries {
   background-color: #FFFFE0;
}
table.calendar_small td.entries a {
   display: block;
   font-weight: bold;
   color: #555555;
   background-color: #FFFFE0;
   text-decoration: none;
}
table.calendar_small td.today, table.calendar_small td.today a {
   background-color: #555555;
   color: #FFFFFF;
}
/**************************/
table.calendar_big {
   width: 100%;
   font-size: 14px;
   font-family: 'Helvetica Neue', Arial, sans-serif;
   margin: 10px;
   border-collapse: collapse;
   border-spacing: 0;
}
table.calendar_big th {
   font-size: 16px;
   line-height: 2.5em;
   border-bottom: 3px solid #32A4FE;
}
table.calendar_big td {
   padding: 4px;
   margin: 0;
   width: 14%;
   text-align: left;
   background-color: #F9FBFC;
   color: #1B5196;
   border: 1px solid #97DCFF;
   vertical-align: top;
   height: 84px;
}
table.calendar_big td.months_heading {
   border-left: 0;
   border-right: 0;
   color: #555555;
   font-weight: bold;
   height: 2.5em;
   vertical-align: middle;
}
table.calendar_big td.other_month {
   background-color: #ECF9FF;
   color: #FF0000;
}
table.calendar_big a {
   font-weight: normal;
   color: #0C438A;
   text-decoration: none;
   font-weight: 600;
}
table.calendar_big a:hover {
   text-decoration: underline;
}
table.calendar_big td.today, table.calendar_big td.today a {
   background-color: #1B5196;
   color: #FFFFFF;
}
table.calendar_big td ul {
   font-size: 80%;
   line-height: 1.2;
   list-style-image: none;
   list-style-position: outside;
   list-style-type: none;
   margin: 0.5em 0 0;
   padding-left: 0;
}
table.calendar_big td li {
   margin-bottom: 1px;
}
</style>
                </head>
                
                <!-- BEGIN body -->
                <body id="bodycss">
                <a href="#dat-menu" class="ot-menu-toggle"><i class="fa fa-bars"></i> Menu</a> 
                <!-- BEGIN .boxed -->
                <cms:embed "barratop.php" />
                <cms:embed "logo.php"/>
                <div class="boxed active"> 
                  
                  <!-- BEGIN .header -->
                  <cms:embed "menu.php" />
                  
                  <!-- BEGIN .content -->
                  <section class="content"> 
                    
                    <!-- BEGIN .wrapper -->
                    <div class="wrapper">
                      <div class="main-content has-sidebar"> 
                        <!-- <div class="main-content has-double-sidebar"> --> 
                        <!-- <div class="main-content"> --> 
                        
                        <!-- BEGIN .left-content -->
                        <div class="left-content  fadeInUp animated animated" data-wow-delay="1s" data-wow-offset="150" style="visibility: visible;
    background-image: url(images/back.png);
    background-repeat: no-repeat;
    animation-delay: 1s;
    animation-name: fadeInUp;
    margin-top: -20px;"> 
                          
                          <!-- BEGIN .home-block -->
                          <div class="main-title">
                            <h2>Investimento</h2>
                            <span>TrindadePrev</span> </div>
                          <div class="item">
                            <div class="item image-left" >
                              <div class="item-header" style="padding-bottom: 10px;  width: 240px;"> <img src="images/TRINDADEPREV.jpg" style=" width: 210px; padding: 18px;"> </div>
                              <h2 style="text-align: center; padding: 16px 0px 23px 0px; color: #3C98CA;">Agenda Pública</h2>
                              
                            [color=#40BF00]  <!-- Here begins the categories. I want to list the category like a button.
so clicked open a calendar only the desired category -->
                              
                              <cms:folders masterpage='agendaint2.php'>
                                <p class="btagenda"><a href="<cms:show k_page_link />">
                                  <cms:show k_folder_title />
                                  </a></p>
                              </cms:folders>
                            </div>
                            
                            <!-- end category -->
                            
                            <cms:calendar date="<cms:gpc 'cal' />" masterpage='agendaint2.php' show_future_entries='1' >
                              <table class="calendar_big">
                                <h2 style="font-size: 27px;     text-align: -webkit-center;"> <a href="<cms:concat k_page_link '?cal=' k_prev_calendar_date />"> <img src="img/Seta_esquerda_Azul.png" style="width:28px;" alt="" /> </a> <span style="color: #338DFF;">
                                  <cms:date k_calendar_date format=' %B, %Y' locale='pt_BR' charset='ISO-8859-1' />
                                  </span> <a href="<cms:concat k_page_link '?cal=' k_next_calendar_date />"> <img src="img/Seta_Direita_Azul.png" style="width:28px;" alt="" /> </a></h2>
                                <tr>
                                  <cms:repeat count='7'>
                                    <td class="months_heading"><cms:zebra 'Dom' 'Seg' 'Ter' 'Qua' 'Qui' 'Sex' 'Sab'/></td>
                                  </cms:repeat>
                                </tr>
                                <cms:weeks>
                                  <tr>
                                    <cms:days >
                                      <cms:if k_timeline_position='present'>
                                        <cms:set tdclass='today' />
                                        <cms:else />
                                        <cms:set tdclass='' />
                                      </cms:if>
                                      <cms:if k_position='current_month' >
                                        <cms:if k_count_entries >
                                          <td class='entries <cms:show tdclass />' align='center'><a href="#">
                                            <cms:show k_day />
                                            </a>
                                            <ul>
                                              <cms:entries limit='2' skip_custom_fields='1'>
                                                <li> <a href="<cms:show k_page_link />">
                                                  <cms:show k__title />
                                                  </a> </li>
                                              </cms:entries>
                                            </ul></td>
                                          <cms:else />
                                          <td class='<cms:show tdclass />' ><cms:show k_day /></td>
                                        </cms:if>
                                        <cms:else />
                                        <td class='other_month'><cms:show k_day /></td>
                                      </cms:if>
                                    </cms:days>
                                  </tr>
                                </cms:weeks>
                              </table>
                            </cms:calendar>[/color]
                          </div>
                        </div>
                        
                        <!-- BEGIN #sidebar -->
                        <aside id="sidebar">
                          <cms:embed "menulateral.php"/>
                          <cms:embed "redesociais.php"/>
                          <cms:embed "enquete.php"/>
                          <cms:embed "itenslateral.php"/>
                          
                          <!-- END #sidebar --> 
                        </aside>
                      </div>
                      
                      <!-- END .wrapper --> 
                    </div>
                    
                    <!-- BEGIN .content --> 
                  </section>
                  
                  <!-- BEGIN .footer --> 
                  
                  <!-- END .boxed --> 
                </div>
                <cms:embed "rodape.php"/>
                
                <!-- Demo Only --> 
                
                <!-- END body -->
                </body>
                <!-- END html -->
                </html>
                <?php COUCH::invoke(); ?>


code of cloned page that will get your internal pages of the calendar

Code: Select all
<?php require_once( 'adm/cms.php' ); ?>
                <cms:template title='Agenda Pública 2' clonable='1' icon='book'>
                  <cms:editable
    name='imgnoticia'
    label='Image'
    desc='Upload da imagem'
    show_preview='1'
    preview_width='200'
    crop='1'
    type='image' />
                  <cms:editable name='my_imagethumb2' type='jcropthumb' assoc_field='imgnoticia' desc='Cortar sua Imagem corretamente' preview_width='450'  show_preview='1' />
                  <cms:editable
      name='dataagenda'
      label='data agenda'
      type='text'
      />
                  <cms:editable
      name='descagenda'
      label='descrição agenda'
      toolbar='full'
      type='richtext'
      />
                  <cms:editable
      name='telefoneagenda'
      label='telefone'
      type='text'
      desc="telefone"
      />
                  <cms:editable
      name='horarioagenda'
      label='horario'
      type='text'
      desc="horario"
      />
                  <cms:editable
      name='enderecoagenda'
      label='endereco'
      type='text'
      desc="endereco"
      />
                  <cms:folder name="conselho" title="Conselho" />
                  <cms:folder name="presidente" title="Presidente" />
                  <cms:folder name="assessorias" title="Assessorias" />
                  <cms:folder name="controleinterno" title="Controle Interno" />
                  <cms:folder name="assessoriapresid" title="Assessoria Apoio a Presidencia" />
                  <cms:folder name="recursoshumanos" title="recursos Humanos" />
                  <cms:folder name="contabilidade" title="Contabilidade" />
                  <cms:folder name="financas" title="Finanças" />
                  <cms:folder name="secaobeneficios" title="Seção Beneficios" />
                  <cms:folder name="protocoloprocessos" title="Protocolo Análise Processos" />
                  <cms:folder name="periciamedica" title="Pericia Médica" />
                  <cms:editable name='my_css' type='message'>
                    <style type="text/css">
#k_page_name {
   display: none;
}
</style>
                  </cms:editable>
                </cms:template>
                <!DOCTYPE HTML>
                <!-- BEGIN html -->
                <html lang = "en">
                <!-- BEGIN head -->
                <head>
                <cms:embed "css.php" />
                <cms:embed "js.php" />
                </head>
                
                <!-- BEGIN body -->
                <body id="bodycss">
                <a href="#dat-menu" class="ot-menu-toggle"><i class="fa fa-bars"></i> Menu</a> 
                <!-- BEGIN .boxed -->
                <cms:embed "barratop.php" />
                <cms:embed "logo.php"/>
                <div class="boxed active"> 
                  
                  <!-- BEGIN .header -->
                  <cms:embed "menu.php" />
                  
                  <!-- BEGIN .content -->
                  <section class="content"> 
                    
                    <!-- BEGIN .wrapper -->
                    <div class="wrapper">
                      <div class="main-content has-sidebar"> 
                        <!-- <div class="main-content has-double-sidebar"> --> 
                        <!-- <div class="main-content"> --> 
                        
                        <!-- BEGIN .left-content -->
                        <div class="left-content  fadeInUp animated animated" data-wow-delay="1s" data-wow-offset="150" style="visibility: visible; animation-delay: 1s; animation-name: fadeInUp;"> 
                          
                          <!-- BEGIN .home-block -->
                          <div class="main-title">
                            <h2>Agenda Pública</h2>
                            <span>TrindadePrev</span> </div>
                          <cms:pages masterpage='agendaint2.php'
                  folder=k_folder_name
                  start_on=k_archive_date
                  stop_before=k_next_archive_date
                  paginate='1'
                  limit='' 
                        orderby=''  
                              order=''>
                            <div class="item">
                              <div class="item-header"> <a class="image-hover" data-path-hover="M 41,53 46,34 56.5,37.5 58,59 48.5,68.2 z">
                                <p>Data:
                                <cms:show dataagenda/>
                              </p>
                                <figure> <img src="<cms:show my_imagethumb2/>">
                                <svg viewBox="" preserveAspectRatio="none">
                                    <path d="" fill=""></path>
                                  </svg>
                              </figure>
                                </a> </div>
                              <div class="item-content">
                                <h2 style="line-height: 2; font-size: 23px; color: #3C98CA;"><a>
                                  <cms:show k_page_title />
                                  </a></h2>
                                <p
                                <cms:show descagenda/>
                                </p>
                              </div>
                            </div>
                          </cms:pages>
                        </div>
                        
                        <!-- BEGIN #sidebar -->
                        <aside id="sidebar">
                          <cms:embed "menulateral.php"/>
                          <cms:embed "redesociais.php"/>
                          <cms:embed "enquete.php"/>
                          <cms:embed "itenslateral.php"/>
                          
                          <!-- END #sidebar --> 
                        </aside>
                      </div>
                      
                      <!-- END .wrapper --> 
                    </div>
                    
                    <!-- BEGIN .content --> 
                  </section>
                  
                  <!-- BEGIN .footer --> 
                  
                  <!-- END .boxed --> 
                </div>
                <cms:embed "rodape.php"/>
                
                <!-- Demo Only --> 
                
                <!-- END body -->
                </body>
                <!-- END html -->
                </html><?php COUCH::invoke(); ?>


already tried in various ways.
but I am not managing to create a calendar of events for each category.

Re: events calendar category

avatar
KK
Moderator
Ok, so you are creating the calendar entries (i.e. cloned pages) using one template and them displaying the calendar on another non-cloned template.

Since the display template is not the one the entries actually belong to, we cannot use the proposed 'folder-view' with it - we'll have to explicitly pass on the selected folder name through querystring parameters.

I'm posting the changes that I made to your code below. Please make the same changes in your template and that should now work the way you want.
<cms:set my_folder="<cms:gpc 'fld' />" />
<cms:set my_date="<cms:gpc 'cal' />" />

<cms:folders masterpage='agendaint2.php'>
<a href="<cms:show k_page_link />?cal=<cms:show my_date />&fld=<cms:show k_folder_name />">
<cms:show k_folder_title />
</a>
</cms:folders>


<cms:calendar date="<cms:show my_date />" folder=my_folder masterpage='agendaint2.php' show_future_entries='1' >
<table class="calendar_big">
<h2>
<a href="<cms:concat k_page_link '?cal=' k_prev_calendar_date '&fld=' my_folder />"> Prev </a>
<a href="<cms:concat k_page_link '?cal=' k_next_calendar_date '&fld=' my_folder />"> Next </a>
</h2>

Please note how we are passing both the folder as well as the date as parameters to all the navigation links.
Hope it helps.

Re: events calendar category

avatar
IdealSolucoes
Registered User
KK wrote: Ok, so you are creating the calendar entries (i.e. cloned pages) using one template and them displaying the calendar on another non-cloned template.

Since the display template is not the one the entries actually belong to, we cannot use the proposed 'folder-view' with it - we'll have to explicitly pass on the selected folder name through querystring parameters.

I'm posting the changes that I made to your code below. Please make the same changes in your template and that should now work the way you want.
<cms:set my_folder="<cms:gpc 'fld' />" />
<cms:set my_date="<cms:gpc 'cal' />" />

<cms:folders masterpage='agendaint2.php'>
<a href="<cms:show k_page_link />?cal=<cms:show my_date />&fld=<cms:show k_folder_name />">
<cms:show k_folder_title />
</a>
</cms:folders>


<cms:calendar date="<cms:show my_date />" folder=my_folder masterpage='agendaint2.php' show_future_entries='1' >
<table class="calendar_big">
<h2>
<a href="<cms:concat k_page_link '?cal=' k_prev_calendar_date '&fld=' my_folder />"> Prev </a>
<a href="<cms:concat k_page_link '?cal=' k_next_calendar_date '&fld=' my_folder />"> Next </a>
</h2>

Please note how we are passing both the folder as well as the date as parameters to all the navigation links.
Hope it helps.



friend helped me too.
Thank you very much.
Your help was very important to me.
I hope someday to reward it.

thank you friend.
hug.

greetings. :D :D :D

Re: events calendar category

avatar
KK
Moderator
You are welcome, my friend :)
I am glad I could help.

Re: events calendar category

avatar
IdealSolucoes
Registered User
KK wrote: You are welcome, my friend :)
I am glad I could help.


Hello!

a doubt!

My schedule is running smoothly as I wish.

most have a doubt, when they changed the months on the calendar the page updates when updates the page goes up hiding the calendar that is down the page to see the calendar will have to scroll up down, would be able to make an anchor for when the page updates that already shows the calendar below.

I tried to add an anchor more without success. :?:

Re: events calendar category

User avatar
trendoman
Registered User
<span id="cal" ></span>
<cms:show k_page_link />?cal=<cms:show my_date />&fld=<cms:show k_folder_name />#cal

also here
<a href="<cms:concat k_page_link '?cal=' k_prev_calendar_date '&fld=' my_folder />#cal">

Re: events calendar category

avatar
IdealSolucoes
Registered User
trendoman wrote:
<span id="cal" ></span>
<cms:show k_page_link />?cal=<cms:show my_date />&fld=<cms:show k_folder_name />#cal

also here
<a href="<cms:concat k_page_link '?cal=' k_prev_calendar_date '&fld=' my_folder />#cal">


thank you, my friend.
Friendly. :D :D :D :D
Post a reply
Previous 1, 2 Next
14 posts Page 1 of 2
Return to Bug Reporting and Troubleshooting

cron