Rolf

Or with black background added to cover the red brown orange bands:

[coolclock skin="retro" radius="200"]
{
	"outerBorder": {
		"lineWidth": 100,
		"radius": 50,
		"color": "black",
		"alpha": 1
	},
	"largeIndicator": {
		"lineWidth": 10,
		"startAt": 75,
		"endAt": 95,
		"color": "white"
	},
	"hourHand": {
		"lineWidth": 10,
		"startAt": 0,
		"endAt": 70,
		"color": "white"
	},
	"minuteHand": {
		"lineWidth": 5,
		"startAt": 0,
		"endAt": 80,
		"color": "white"
	},
	"secondHand": {
		"lineWidth": 2,
		"startAt": 0,
		"endAt": 85,
		"color": "white"
	},
	"secondDecoration": {
		"lineWidth": 4,
		"startAt":  0,
		"radius": 8,
		"color": "white",
		"fillColor": "white"
	}
}
[/coolclock]

Hi Steve, first: My appologies for this late reply. Somehow the messaging system seems to have failed and you did not get the help you needed at that moment.

Looking at your sample page, I see you have tried another clock solution in the meantime.

To answer your questions as much as possible:

The clock hands cannot be larger than 100% of the clock radius. To make the minute and second hands go past the minute/hour markers, you will need to move the hour markers inward instead.

Take a look at the clock named “Mister” at the end of https://premium.status301.com/knowledge-base/coolclock/skins/ for example. There, the second hand is further out than the hour markers. Or the clock “Machine”, fifth from the top, where the minute hand is further outside.

A custom skin with these parameters might be close to what you are looking for:

Hi Jorge, both categories and tags at the same time is not possible. Your only solution would be to set it to Keywords and then (when creating your news posts) assign copies of the tags and categorie names to the (new) Keywords field.

Hi Carrington, our apologies for the inconvenience. Somehow the form submissions were filtered out as spam. Good thing: your last message did come through. Thank you for insisting and trying again!

We’ll have to rethink our spam filters, currently being applied to all forms, not just the public ones…

Hi Carrington, my apologies for the late reply. I’ve checked your page and see what you mean. I’ll try to reproduce this and will let you know asap.

That looks good (even without the !important) just add an overflow:hidden; 🙂

Hi Chris,

Moving the title to the top depends on which Title option you are using. If set to the (default) option “Float”, then you can try with the following CSS. Adjust the value -15px if it does not vertically align with your close button (depends on several factors).

.fancybox-title-float {
    top: -15px;
    bottom: initial;
}

To keep the arrows visible you can use the following CSS which will do two things: make the arrows permanent and move them to the outer border like the close button (so they do not permanently cover the lightbox content.

#fancybox-left,#fancybox-right {
    width: 0;
}
#fancybox-right span {
    left: auto;
    right: -15px !important;
}
#fancybox-left span {
    left: -15px !important;
}

Hi Ken, it looks like you found a bug. The noseconds parameter is ignored unless you explicitly set it to 1 (or true) like noseconds=1. It will be fixed in the upcoming release, but in the meantime just add =1 to hide the second hand.

To add a digital view to the clock, you can set the parameter showdigital="digital24+" but this cannot be done in combination with showdigital="date".

The font parameter applies only to the date/digital text and it must be in a very specific format to work. What are you trying to do? Make the text larger or in a different font face?

To change the hour and minute hand colors, you’ll have to create a custom theme. The following example is a very basic one with blue hands:

[coolclock skin="custom" radius="60" showdigital="date" noseconds="1" align="center" background_image="http://fremontcountydems.org/staging/wp-content/uploads/1872-2022-CANONCITY-DEMOCRATS.png" background_stretch="contain"]
{
  "hourHand": {
    "lineWidth":5,
    "startAt":-15,
    "endAt":50,
    "color":"#267EB9"
  },
  "minuteHand": {
    "lineWidth":3,
    "startAt":-15,
    "endAt":65,
    "color":"#267EB9"
  }
}
[/coolclock]

This is the result: