Does Sitecake support editing of Calendar day content

editing
#1

Does Sitecake support inserting and editing the nice monthly html calendars that can be created and downloaded at http://freehtmlcalendar.com? It would be great to be able allow our users to login in and edit the content for each day in the calendar table. I like how they allow you to create twelve monthly calendars on one page with one click. A user could enter events for several months at a time and then click “Publish”.

#2

Well table editing is not supported, but you could probably add <div class="sc-content"></div> inside each td beside span that holds day number so user can add text inside those divs. With some additional HTML and css styling it can be easily doable.

#3

That must be what I am missing. Adding the div inside each td did not do it. I like the “easily doable” part. Any more hints would be greatly appreciated. Thank you.

#4

This should work. Please send the example where it is not working so we can take a look.

#5

Sample solution is at: easyedit.host - This website is for sale! - easyedit Resources and Information. (pw=admin). The code was inserted onto the blank page by dragging code button.
I have also included screenshot of code (only for first week of calendar so it would fit in one screenshot)

code.jpg1180×991 80.8 KB

#6

Yes, I see the problem. You nested an editable div in another etitable div. You cant add an sc-content div inside the HTML.

#7

Right now I think the only option is to hardcode a table into the html. So you would have to remove the sc-content and sc-html class from the top two lines in your code. Then it should work.

#8

It did not work after I removed the two described divs, so I have now removed everything except for the first week of the month. What might I need to add back in to make this minimalist approach work?

Minimal Calendar Code.jpg794×615 31.2 KB

#9

First, put the TITLE tag back between the tags and see what happens.

#10

By tags I mean HEAD tags. :wink:

#11

I may have another workaround for you for putting table data in your page more dynamically. It involves making an unordered list behave like a table row and it looks like this:

The CSS code to get this effect is:

.container {
border-collapse: collapse;
width: 700px;
}


.container ul, .container li {
border-color: gray;
border-width: 1px;
border-style: solid;
}

.container ul {
display: table-row;
padding: 2px;
width: 100%;
}

.container ul li {
display: table-cell;
padding: 7px;
width: 14%;
}

.container ul.header {
background-color: gray;
color: white;
}

And the HTML would be:

<div class="container sc-content">
	<ul class="header">
		<li>mon</li>
		<li>tue</li>
		<li>wed</li>
		<li>thu</li>
		<li>fri</li>
		<li>sat</li>
		<li>sun</li>
	</ul>
	<ul>
		<li><br></li>
		<li>1</li>
		<li>2</li>
		<li>3</li>
		<li>4</li>
		<li>5</li>
		<li>6</li>
	</ul>

…
</div>

It basically treats UL like a table-row and LI like a table-cell. So for each new row you would drag a new Unordered List block beneath the last one. As a final touch I attached a User Style to rows so you can select ‘header’ from the drop-down menu to create a header effect for the top row. Hope it helps. :slight_smile:

#12

Yes, that works! You came up with your creative solutions very fast. Thank you.