3 Guess the score block

00:00:04.080 –> 00:00:06.720
Hi there, welcome back. Let’s set up

00:00:07.040 –> 00:00:09.200
our guess the score block. Here we have

00:00:09.200 –> 00:00:11.100
it, and I now need to put

00:00:11.100 –> 00:00:14.080
in, most importantly, my team names,

00:00:15.280 –> 00:00:16.640
where it says Team 1 and Team 2.

00:00:21.920 –> 00:00:24.720
Okay, and in our original,

00:00:26.800 –> 00:00:29.100
you can see I don’t have a logo

00:00:29.100 –> 00:00:32.920
in here actually. Instead, I

00:00:32.920 –> 00:00:34.160
would just like the team names and a

00:00:34.160 –> 00:00:36.080
background image for each. So let’s add

00:00:36.080 –> 00:00:37.840
those background images in now.

00:00:38.960 –> 00:00:41.760
Click on the camera

00:00:41.760 –> 00:00:44.640
symbol top right. I’m going to

00:00:44.640 –> 00:00:47.600
use the media in my media library. I’ve

00:00:47.600 –> 00:00:50.160
created a folder with the images that I

00:00:50.400 –> 00:00:51.120
want.

00:00:54.240 –> 00:00:57.040
And then I’ve got them in there. Let’s

00:00:57.040 –> 00:00:58.400
do the same for the other one.

00:01:08.400 –> 00:01:10.920
Okay, and now let’s adjust this so that the

00:01:11.120 –> 00:01:12.760
colors reflect what I wanted in that

00:01:12.760 –> 00:01:15.360
original with a sort of red and

00:01:15.960 –> 00:01:18.720
a blue background there. So click

00:01:18.720 –> 00:01:21.200
on the paintbrush symbol

00:01:22.840 –> 00:01:23.840
and now I’m going to change that

00:01:23.840 –> 00:01:25.120
background color to a

00:01:26.800 –> 00:01:29.680
red color and adjust the transparency

00:01:29.680 –> 00:01:32.240
down here. Okay,

00:01:33.200 –> 00:01:34.560
and let’s do the same on the other one.

00:01:42.280 –> 00:01:44.960
Okay, good. If you

00:01:44.960 –> 00:01:46.960
wanted to, you could also

00:01:47.100 –> 00:01:50.320
put in the RGBA or hex code down

00:01:50.320 –> 00:01:51.680
here if you want a specific color that

00:01:51.680 –> 00:01:54.400
matches your brand or a specific team. So

00:01:54.400 –> 00:01:57.280
that’s another option. Okay,

00:01:57.920 –> 00:01:59.440
you could also change the text color as

00:01:59.440 –> 00:02:01.920
you saw here. We’ve got text color here

00:02:01.960 –> 00:02:04.800
and I could change that to black, for

00:02:04.800 –> 00:02:06.880
example, but I prefer it in white. So

00:02:06.880 –> 00:02:08.960
let’s put it back to that,

00:02:09.760 –> 00:02:10.560
okay.

00:02:13.040 –> 00:02:15.200
So we’re all set up for this

00:02:15.520 –> 00:02:17.600
block, and in this case actually this

00:02:17.600 –> 00:02:19.800
whole Riddle as well. Because of course

00:02:19.800 –> 00:02:21.680
you can put several blocks in one

00:02:21.680 –> 00:02:24.600
predictor, but these predictor

00:02:24.600 –> 00:02:26.040
Riddles are very often used as a

00:02:26.040 –> 00:02:28.800
stand-alone Riddle for that quick

00:02:28.800 –> 00:02:31.520
interaction in the hours or days

00:02:31.520 –> 00:02:33.760
before a match, for example, so your

00:02:33.760 –> 00:02:36.560
audience can engage with the

00:02:38.800 –> 00:02:41.680
teams, with the event, and

00:02:41.840 –> 00:02:44.120
then you can share another one for a

00:02:44.120 –> 00:02:47.120
different game, for example. One

00:02:47.120 –> 00:02:49.560
thing I would like to do, or I suggest

00:02:49.560 –> 00:02:51.960
doing, is you can also put the date here.

00:02:52.080 –> 00:02:54.720
People often write,

00:02:54.720 –> 00:02:57.440
for example, and then the

00:02:57.440 –> 00:03:00.080
date, whenever that game might be.

00:03:00.680 –> 00:03:03.040
This is obviously imagined because it’s

00:03:03.040 –> 00:03:04.560
not really going on right now.

00:03:08.720 –> 00:03:10.560
And now in the preview, you can see

00:03:11.600 –> 00:03:13.400
we’ve got that there. But I’d like to

00:03:13.440 –> 00:03:15.400
adjust one thing with the

00:03:15.600 –> 00:03:17.760
styling. You can see

00:03:17.760 –> 00:03:19.100
here in our original

00:03:20.400 –> 00:03:22.760
that the text for the

00:03:22.880 –> 00:03:25.200
countries is slightly bigger and also

00:03:25.280 –> 00:03:27.120
slightly higher. I wanted to do that

00:03:27.120 –> 00:03:28.800
because I haven’t put a logo in. Of

00:03:28.800 –> 00:03:31.680
course, that space is saved here

00:03:31.680 –> 00:03:33.400
for you to put in your logo up here. If

00:03:33.600 –> 00:03:35.600
you have an enterprise or business

00:03:35.600 –> 00:03:38.120
account, you can use CSS to

00:03:39.120 –> 00:03:41.840
change specific elements in each

00:03:41.880 –> 00:03:44.640
block or in a Riddle. And so I’ll just

00:03:44.640 –> 00:03:46.080
show you how to do that so we can

00:03:46.240 –> 00:03:48.800
replicate this original design here that

00:03:48.800 –> 00:03:51.640
I went for. Go on to

00:03:51.680 –> 00:03:53.480
Palette, and we’re going to

00:03:54.800 –> 00:03:57.120
copy and edit this to create a new

00:03:57.680 –> 00:04:00.480
palette. Call it GameDay.

00:04:01.280 –> 00:04:03.080
And scroll right down, click on Edit

00:04:03.080 –> 00:04:05.840
under CSS. And now I’ve got some

00:04:05.840 –> 00:04:08.800
CSS here that

00:04:09.360 –> 00:04:12.160
I’ve created that I’m going to

00:04:12.160 –> 00:04:14.100
copy and paste into

00:04:15.920 –> 00:04:18.320
this gray field here. So

00:04:18.640 –> 00:04:21.360
it’s this predictor card element

00:04:23.040 –> 00:04:25.640
that targets the text box here

00:04:26.720 –> 00:04:29.680
for the predictor cards. Okay, and

00:04:29.680 –> 00:04:32.200
I’ve changed the margin and the

00:04:32.320 –> 00:04:34.320
font size, and now I’ll click on Format

00:04:34.320 –> 00:04:36.080
Code and Save, and now you can see these

00:04:36.080 –> 00:04:38.840
changes going live here on the right-hand

00:04:38.840 –> 00:04:41.680
side. So you don’t have to do that, but I

00:04:41.680 –> 00:04:43.360
want to do that because I’m not adding in

00:04:43.400 –> 00:04:45.560
a logo here. That’s up to

00:04:45.600 –> 00:04:47.840
you. So,

00:04:48.560 –> 00:04:51.040
go back into Preview, and yeah, that’s

00:04:51.040 –> 00:04:53.920
how I want it to look. So in the next

00:04:53.960 –> 00:04:56.880
step, we will look at the other sort

00:04:56.920 –> 00:04:59.520
of predictor block. Play around with

00:05:00.040 –> 00:05:02.320
score block for now, and I’ll see you in

00:05:02.320 –> 00:05:02.880
the next step.