Web part properties / Widget

Nicky Zeeman asked on November 14, 2016 13:33

Hi,

I'm fairly new to Kentico and I'm trying to create a website from static HTML. The client wants to have control over the look of the website. So I created a new web part named About section and I let it inherit from Web part zone. Inside this newly created web part I added 2 Editable text and 1 Editable image. I also want to give the client an option to select a background image for the container. On the Properties tab of the newly created web part I created a new field called BackgroundImage with a Data type of File. This allows the client to upload a file in the General tab of the AboutSection in the pages application. However when I choose a file and press apply the filename disappears. It looks like it won't save. Am I missing something? Or is there a different (better) approach for this?

Recent Answers


Adam Gitin answered on November 14, 2016 14:42

Hi Nicky,

Normally I do not give the client access to the DESIGN tab (portal engine) unless they know Kentico and are aware of how to add/remove/move etc. webparts. And of course if the client says they want access to DESIGN tab (build new functionality) I wot say no, but I will explain the risks of playing around there without knowing what you are doing.

But enough with my warnings :)

What I might recommend is using the page type fields for uploading the image (best to use media library). If using page type CMS.MenuItem can use MenuItemTeaserImage field to uplaod image and then mcro to grab image and use as background image.

If custom page type, just add another field and use: Data type: Text Size: 250 Form Control: Media selection

I hope this helps and hope you enjoy using Kentico :)

3 votesVote for this answer Mark as a Correct answer

Nicky Zeeman answered on November 15, 2016 14:31

Hey Adam,

Thanks for you reply! Your warnings got me thinking... So I'm trying to create widgets but it gives me the following problem. Let me explains the steps I've taken so far:

Page

1: I created a new page layout:

<main id="main-content">
    <cms:CMSWebPartZone ZoneID="zoneTest" runat="server" />
</main>

2: I created a new page at the pages application and created a blank page with layout and set the widget zone type to: Customization by page editor So far for the page :)

Web part

After that I created a new web part just like I described above but after defining the default content I set the type to WidgetOnly which deletes the Default content tab. I also added a new property named BackgroundImage which I want to use to display a background image on the div.

Widget

I want to add the web part with the 2 editable text, 1 editable image and BackgroundImage property to the widgets so the client can add this to the page. So I pressed New widget but now I can't find the web part I just created.

Am I missing something or am I doing something wrong..?

Thanks in advance!

0 votesVote for this answer Mark as a Correct answer

Adam Gitin answered on November 15, 2016 20:27

Hi Nicky,

Before you continue down this path, I think it is best to describe what the end result you want.

example: page template where content admin can upload image we can use as backgrounds image in hero.

Write it out here with no mentioning of layouts, widgets or webparts.

I think it best to start from the beginning :)

2 votesVote for this answer Mark as a Correct answer

Nicky Zeeman answered on November 16, 2016 09:09

Hi Adam,

The result I want to achieve is to have a masterpage with a navigation and footer. Inside this page I want to be able to add premade 'blocks'. For example:

  • a 'block' where you can fill in a title, image and content. With the option to choose a predefined background color or background image.
  • a 'block' which holds 2 divs where the user can upload a background image for each of those divs and a title which will link to another page.

I hope this will make it a bit better to understand what result I'm trying to achieve :)

0 votesVote for this answer Mark as a Correct answer

Adam Gitin answered on November 16, 2016 13:15

Hi,

Now all is clear. thanks for the explanation.

You might be able to achieve this with widgets but that might be too much control to content editor.

Meaning, if they will need to add these widgets and add some other one by mistake or add to many widgets to the page, might cause frustration on content editor side.

What you can do is create a page type that has: title, image and content fields.

this page type can be created in a folder on this page.

then you can render it anyway you wna t using a repeater and transformation.

this way content admin part is dummy proof.

Then only need to fill in the fields under the FORM tab on this new page type and your transformation does the rest of the work.

I hope this helps.

2 votesVote for this answer Mark as a Correct answer

Nicky Zeeman answered on November 17, 2016 16:37

Hi Adam,

Thanks for you answer. But I don't think this is what I'm looking for OR I don't understand what you telling me.

The client wants to be able to 'design' pages. By design I mean that the client wants to be able to add pre-designed blocks so they can build their own look of the page.

What I'm trying to achieve is to make these pre-designed blocks so the client can add these to a new page or remove one from an existing page. Inside these blocks I want to define fields like a title, image, background-image/color.

Correct me if I'm wrong but for what I understand of what you explained to me is to make a pre-designed page where the client can, for example, fill in a title and upload a photo.

0 votesVote for this answer Mark as a Correct answer

Adam Gitin answered on November 20, 2016 13:04

Hi,

So currently you only issue is that that IMAGE field is working?

Other than that are you all good with your approach?

I have worked on project where editors wanted the same control you are talking about and the approach was: page types -> for different types of content we created different page types. page type had fields (text, image etc.) "Text w/background image", "content with background (user can select bg color and shapes for bg). All used same transformation name, rendered on page according to node order.

We did it this way as to limit the "damage" content editors might create.

2 votesVote for this answer Mark as a Correct answer

   Please, sign in to be able to submit a new answer.