Custom Widget Template with image as background and radio button choices
I am trying to create a custom sliding banner. The images need to be set as the background so i need to get the images link and set that link as the background url. Ive tried a few things including trying to set (ContentLink[]) profileItem.GetValue("Picture"); as the link but this did not work. Any help?
Also i want to take the choice made on a radio button on the back end for both color of text and position of text to change classes of divs. Can i just put if(choice==0)do this in the template?
Hi Ian,
You can get the MediaUrl of an image and then use it as you want. This is a code snippet for getting the profile image of the currently logged user:
var identity = ClaimsManager.GetCurrentIdentity(); if (identity != null && identity.UserId != Guid.Empty) UserProfileManager profileManager = UserProfileManager.GetManager(); UserManager userManager = UserManager.GetManager("Default"); User user = userManager.GetUser(identity.UserId); SitefinityProfile profile = null; if (user != null) profile = profileManager.GetUserProfile<SitefinityProfile>(user); var avatar = GetImageNativeAPI(profile.Avatar.ChildItemId); string url = avatar.MediaUrl; ... private Image GetImageNativeAPI(Guid imageId) LibrariesManager librariesManager = LibrariesManager.GetManager(); Image image = librariesManager.GetImages().Where(i => i.Id == imageId).FirstOrDefault(); return image; // Set the provider name for the DynamicModuleManager here. All available providers are listed in// Administration -> Settings -> Advanced -> DynamicModules -> Providersvar providerName = String.Empty;DynamicModuleManager dynamicModuleManager = DynamicModuleManager.GetManager(providerName);Type pressReleasesType = TypeResolutionService.ResolveType("Telerik.Sitefinity.DynamicTypes.Model.Pressreleases.PressReleases");// This is how we get the pressReleases item by IDDynamicContent pressReleasesItem = dynamicModuleManager.GetDataItems(pressReleasesType).Where("Title = \"" + title + "\"") .FirstOrDefault();var pictures = pressReleasesItem.GetValue<ContentLink[]>("Picture");List<string> urls = new List<string>();foreach (var item in pictures) var image = GetImageNativeAPI(item.ChildItemId); if (image != null) urls.Add(image.MediaUrl); return pressReleasesItem;I figured out the second issue using a sf:conditional statement. But as far as the background image...do i need to set the second code chunk you gave for the dynamic module in a code behind or can i use it right in the widget template.
Hi Ian,
You should place the code snippet in the code behind of the widget template. You can use the code snippet for your dynamic module if you will get the url from it, after getting the url you want you can set it as a background image of any control in your template. Example:
MyElement.Style.Add("background-image", @"url(""" + myImageUrl + @""")");Button1.Style.Add("background-color", "red");MyDiv.Attributes["bgcolor"] = "lightblue";