Hi,
1. I'm not sure what you're refering to when you say "character box" ? The top area of the layout with the product name and the product code is updated each time with the new product code. And I don't see the product code displayed anywhere else on your page. So I don't know how to answer.
2. Edit the product / show_default view file via the menu Display>Views. There, you should have a view builder where you can drag & drop the elements around, including the product code. So it should be easy to position it where you want.
3. The variant name being smaller is done by custom CSS added in your template:
i.imgur.com/Km2AQ3i.png
.hikashop_product_variant_subname {
font-size: 24px;
}
www.autovakshop.nl/templates/autovakshop_v2/css/custom.css
Replace that code by:
.hikashop_product_variant_subname {
display: block;
}
and it will be the same size on a line below the main product name.
And to remove the ":" at the beginning of the variant name, you want to use a translation override on the translation key HIKA_VARIANT_SEPARATOR, like this:
HIKA_VARIANT_SEPARATOR=""
www.hikashop.com/download/languages.html#modify