In our post, we would like to give you a walkthrough about how to use the localization files in Orchard Core. With the localization files, we will see the brand new RTL support and close our post with the new attached media field! On Orchard Core Demos Use localization files To get localization files you can go to the documentation of Orchard Core, where you will find the link called localized. This will navigate you to the Crowdin page of Orchard Core. At the upper right corner of the page, you will find a button to download translations. Download this ZIP file and extract the Localization folder to your App_Data folder. You can see that we have one folder for each language. These will come NuGet packages at some point. If you have a running site you have to restart it, because these files will be found and loaded only on startup. The next thing to do is to enable the Localization module, that provides support for UI localization.After that you should head to Configuration -> Settings -> General and add the supported cultures for the site. Here we added to cultures (Arabic and French) to the list of the supported cultures. If we set the default culture to French and hit Save, you will see the localized Settings page. RTL support Now because in the previous demo we added Arabic to the list of the supported cultures we can see the RTL support. Set Arabic as the default culture and hit Save. Now everything is translated in Arabic and everything is on the right. It automatically picks up the RTL logic from the current culture and all the CSS have custom properties to render differently based or not on RTL flags. In the following screen, you can see the Assets page using the Arabic culture. The Assets.json file has a new property called generateRTL. If you set the value of this property to true, this will process the CSS files to generate a new rule specifically for RTL by inverting all the margins and the paddings and the positions, because it's integrated with the Gulp pipeline. You can see a good example for the RTL support in the media.css file of the OrchardCore.Media module. Attached media field Let's see how to use the new attached media field in Orchard Core! If you set up your site using the Blog recipe, you can add a new field to the existing Article content type. Go to the content definition of the Article content type and add a new Media Field to it. Let's call it Images. Now if you edit the Images Media Field, there should be an option to say I would like to use the attached type of the editor. In the following GIF, you can see how to change the editor type of the media field and add images with the different editor types. The main difference is now instead of browsing an image from the Assets, you can upload your new image from your computer. So in the case of an attached media field, you can't pick a file using the media picker. These pictures are not available in the media manager, they are only stored for this content item and only accessible from this content item. They are stored in the same folder as all the media, but they are not manageable. The content item is the aggregate root of these images. If you navigate to Content -> Assets we don't see the files, just if you have the right permissions for that. On Lombiq Orchard Dojo Newsletter Now we have 59 subscribers of the Lombiq's Orchard Dojo Newsletter! We have started this newsletter to inform the community around Orchard with the latest news about the platform. By subscribing to this newsletter, you will get an e-mail every time when a new post published to Orchard Dojo, including This week in Orchard of course. Do you know of other Orchard enthusiasts who you think would like to read our weekly articles? Tell them to subscribe here! If you are interested in more news around Orchard and the details of the topics above, don't forget to check out the recording of this week's Orchard meeting!

The content localization for Orchard Core reached a huge milestone! Don't hesitate to read our post about the newest awesome features of the CMS! On Orchard Core Apply dynamic content type permissions to Admin Menu The dynamic content type permissions are now implemented. In the past they were not supported in the navigation (you clicked on the menu and got a permission error message), now the admin menu reflects the permissions. You can see an example of this in the following GIF. There is a user who logged in with a contributor role. If the admin adds or removes permissions, the admin menu reflects the changes and hides/shows the options in the New, Content Types and List Admin Node menu. Features bulk actions Now you can enable multiple features at the same time. In the past, we had the checkboxes, but we were not taking them into consideration. If you navigate to Configuration -> Modules and open the select list near the Actions, you can see that now you can enable, disable and toggle the features that you have selected using the checkboxes before them. Use Bootstrap modal instead of browser confirm When you have to confirm an action (like Delete), we're using a Bootstrap modal instead of the native browser popup, so it looks nicer. And of course it's also localizable in the following way: <div id="confirmRemoveModalMetadata" data-title="@T["Delete"]" data-message="@T["Are you sure you want to remove this element?"]" data-ok="@T["Ok"]" data-cancel="@T["Cancel"]"></div> This div has data attributes in it (for example title and message) and we localize the text here that we want to include to JavaScript. From JavaScript, we load the element by ID and get its data which is the localized text. You don't inject localization in JavaScript, you inject it in HTML for encoding and security reasons. Orchard Core Translations repository By using this repository, we will automatically get all the localizations from Crowdin. There will be an AppVeyor script, that will automatically list all the localizations from Crowdin and generate a NuGet package for each of the languages and then push it to NuGet. So, the AppVeyor script will download the files, create a package and publish it to NuGet. This package will contain the AppData with the exact structure, so it will contain the pot files for the language. ASP.NET Core - App Building Workshop There was an app building workshop, where developers created something using ASP.NET Core. The demo is about building a conference agenda website. Sébastien did it also in Orchard Core to be sure you can do the same thing in Orchard. In our documentation, we have a Guides section and there is a tutorial called Building a Website from a Web Template (TBD). With the help of this conference, we could write this section soon. RTL support for TheAdmin theme The latest issue was to merge this PR was to do not manage two different files and then to have some condition in the theme to check the current culture and then switch between the CSS files. The goal is to have only one single CSS file and thanks to Hisham Bin Ateya this PR now merged. Demos Content localization If you would like to make your content items localizable you have to enable the Content Localization module. Then you can head to the Configuration -> Settings -> General page and hit the Add or remove supported cultures for the site link and add supported cultures for the site. Let's add some cultures! Now you have an enabled Content Localization module and added some supported cultures to your site. Time to do some content localization! By enabling the Content Localization module, you can attach a new content part, called Localization to the content type that you would like to localize. Let's edit the Blog Post content definition and add the Localization part to it! When you install your site using the Blog recipe, you have one predefined blog post. If you would like to edit your blog post, you will get the following screen. You will notice that you cannot add a new localized instance of your content item until you do not save the existing one. By saving a content item that exists before, you will create the localized version of the content item, in our case the Hungarian version will be created, because this is the default culture of our site. After saving the content item you will notice that the editor has changed. The list of the cultures this site supports appears with a little plus sign before each culture. By clicking one of the plus signs, a new localized version of the content will create, keeping the content of the item. If you navigate back to Blog, you will see a little badge icon under each blog post showing the culture of the content item. Notice the new Localizations button. By clicking on it, you can create a new localized version of the content item or edit an existing one. Now if you edit the Hungarian version of this blog post, you will see the changed icon before the Qafar. That's because a content item with that culture already exists and by selecting the Qafar version, you can edit the existing content item instead of creating a new one. Thanks to JP Tissot, this feature will be merged to dev soon and with this PR, we will reach a huge milestone towards supporting localization in Orchard Core! On Lombiq Orchard Dojo Newsletter Now we have 59 subscribers of the Lombiq's Orchard Dojo Newsletter! We have started this newsletter to inform the community around Orchard with the latest news about the platform. By subscribing to this newsletter, you will get an e-mail every time when a new post published to Orchard Dojo, including This week in Orchard of course. Do you know of other Orchard enthusiasts who you think would like to read our weekly articles? Tell them to subscribe here! If you are interested in more news around Orchard and the details of the topics above, don't forget to check out the recording of this week's Orchard meeting!

There was no Orchard Podcast this week, but we have lots of news around Orchard Core and new PRs that will be added to Orchard Core soon! On Orchard Core The Arabic translation for Orchard Core is ready A few weeks ago Hisham Bin Ateya and Abdullah Salem have started to work on the Arabic translation for Orchard Core. Thanks to their hard work, the Arabic translation is now ready! This is the second language that has been completed after the French language, which is the main language for many of the core team. Now it's time to test those translations! Order TimeZone list by name When you would like to set the default time zone for your site under Configuration -> Settings -> General you had to select the preferred timezone from a list that wasn't ordered. Now thanks to this PR you can set the value of the time zone using a list that contains ordered values. New user created event and assign user to role task to workflows Soon you can use two brand new activities when constructing your workflows in Orchard Core. The first one called User created, which is surprisingly fired when a user created. The second one is about assigning a role to a user. Let's say we attached this task after the user created event. In this case, when you edit this task, you can say that assign the Authenticated role for the user that has been created just now. In the following workflow, we do the following and show success or failed notification just for demonstration purposes. GitHub authentication Thanks to Michael Petrinolis when this PR will be merge, you can authenticate yourself in Orchard Core using GitHub, by adding this provider to the list of supported external providers soon. Let's see how this feature will work! First, you need to create a new GitHub App. To do that, head to the GitHub Apps page in the Developer settings and hit New GitHub App. Here you need to provide the name of your GitHub app, the full URL to your GitHub App's website and a user authorization callback URL. Don't forget to generate a private key. After you will get a Client ID and a Client secret. You will need them in the next step. Now you can navigate to Orchard Core admin site and enable the Github Authentication feature. After that, you can notice the Github Authentication option under Github in the menubar. Copy your values here and hit save. Now let's open a new incognito window and navigate to the admin page. Here you can see the GitHub, as another service to log in. Provide the username and the password of a GitHub account to sign in. Now Orchard Core asks you to create a new account based on the user information you have just provided in the previous step. If you click on Register your user account will be created in Orchard Core and you will be able to log in using your newly created account. For note, let's see what happens if a user tries to login with an external provider, and registration is enabled: If the external provider provides an email claim, we search for an existing account with that email. If not found, a new OC Account is created based on the username, email, and password provided by the user. If found, we request the password of the OC Account in order to link the external login. There is a PR that takes into consideration the email must confirmed parameter, if we request a password in order to create a local Account from external login, and also uses the ReCaptcha. There is a front page (OrchardCore.Users/Account/ExternalLogins) where you can link/unlink OC account with external providers. Of course, is not complete, we must decide how this is integrated with profile/account info in admin/front end. Regarding the GitHub, you must select to use your email in public and select which one of the verified emails will be included in the claims. External Login registration without password As you noticed in the previous section when you create a new account using an external login provider you have to provide a password to create the user account in Orchard Core. There is a PR to add a setting to register external users without requesting a local password. In this PR, Michael Petrinolis also implements the way to generate a username instead of parsing claims from external login info and to integrate ReCaptcha in External Login Registration. Facebook module OrchardCore.Facebook provides the following features: Core Components Facebook Login First, you need to enable the Users Registrations module and put a tick in the Users can create new accounts on the site checkbox under Configuration -> Settings -> Registration, because we will create a new user account based on the details provided in the Facebook log in page. To register the Facebook App with the site you need to provide the following settings: AppId: Facebook application id. AppSecret: The application secret. Both settings are available in the Facebook for developers application's page, under Basic Settings. Now enable the Facebook Login module and add these values to Orchard Core. The configuration can be set through the Configuration -> Facebook -> Application menu in the admin dashboard. Now you can log in in your site using a Facebook account, where you can get a familiar screen. After that, you can create your new account in Orchard Core that you can use to log in to Orchard. But the PR is not just about authenticating users from Facebook. If you head to the modules, you will find a feature called Facebook Social Plugins Widgets. Let's enable it! Let's say you installed your site using the Blog recipe. In this case, you have a Page content type with a FlowPart attached to it. Create a new Page and hit on the Add Widget button. Here you will see several new widgets that you can attach to your content type that has a FlowPart attached, like Facebook Comments, Facebook Share, Facebook Like and many more. If you publish or preview your page you will see that the widgets are displayed in your page. On Lombiq Orchard Dojo Newsletter Now we have 57 subscribers of the Lombiq's Orchard Dojo Newsletter! We have started this newsletter to inform the community around Orchard with the latest news about the platform. By subscribing to this newsletter, you will get an e-mail every time when a new post published to Orchard Dojo, including This week in Orchard of course. Do you know of other Orchard enthusiasts who you think would like to read our weekly articles? Tell them to subscribe here!

Orchard Core Beta 3 is here! Read our post about the latest improvements of the new release and a way about how we could store static media files in the future using Orchard Core! On Orchard Core Orchard Core Beta 3 release We are proudly announcing that the community shipped Orchard Core Beta 3 release! Head to the GitHub page of Orchard Core to download the assets of the new release, where you can also find the list of changes for this release! Fixing DataAnnotations localization Using the PO file string localizer, users can't localize data annotations. When you have a model with some Required or DisplayName attributes, the value of the Error Message will be translated automatically using the StringLocalizer. In Orchard 1.x it never worked, but in Orchard Core, it supposed to work because it's using the correct service for translating which Orchard implements. The IStringLocalizer is created by a StringLocalizerFactory. The question is should a StringLocalizer know about the culture supposed to render or is it when we call _localizer.GetString that we should check what is the current culture? Our assumption was that the localizer should be localize for a specific culture because it had a method called WithCulture to return a new one for another culture. But actually, it's not working in this way. In our case is that we were creating a localizer for the current culture (like English, because it's our default), then we go on a page for Spanish, and it will still reuse the same localizer. Now we do the culture resolution when the GetString is called on the instance. It worked in the case of views, because the views get a new StringLocalizer instance every time they rendered, but not when the attributes are evaluated. It's important because this package is not just for the Orchard Core Framework or the CMS, it's a NuGet package, that anyone can use to localize their ASP.NET applications based on PO files. We support pluralization and dynamic PO files too. How to create Media content items in Orchard Core? In Orchard Core media are not content items, they are just files with a path. The Media Field is just a list of path to a file that is handled by the media storage. Most of the time we don't need a content item for the media. It's faster to store just the path and then to load the content item to store the data and render an image. But we can have Media content items by just create a content type (call it Image, Video or whatever) and attach a Media Field to that. Then you can have content pickers on your other content items to select this kind of media. Localization files guide Last week we wrote about that the new localization guide has been added to Orchard Core documentation. And we have good progress on some translations! As you can see, the Arabic is over 40%, the Chinese more than 80% ready! And we have just added the Orchard Core project to Crowdin! The documentation just has the dev version Now when you visit the ReadTheDocs page of Orchard Core, you will not see the option to read the latest or the dev version of the documentation, only the dev version is available. There can't be any misunderstanding about which branch you are targeting, we always show the latest branch (dev branch), and if we have documentation that only relates to the dev branch, we should make some notes in the documentation to say this won't work with the master. Improve the create button on List Part When you have only one content type attached to a List Part, then instead of having a drop down to select it, there is a button to create the given content type. Storing static Media By using the IFileStore, you can get files, store documents into a file store, etc. The IMediaFileStore implements IFileStore and provides two additional methods: MapPathToPublicUrlKnowing a path for media (like /images/thumbnail.png), this method will return the public URL that we need to render when we render a media. This file store can serve the correct media when it's requested. It's a bridge between an HTTP request to the file that is contained by the store. The default one is using the file system implementation (the folder), so it's just saying whenever you want to access /images/thumbnail.png, it will return /media/images/thumbnail.png. MapPublicUrlToPathThis is the opposite. When we have a public URL, can you guess which image it will present? This is done for a very specific reason. If we have an Azure Blob Storage, we want to render not the local path to the image, but the path to Azure Blob Storage. When we have an image to the media manager, it will store the image for example on Azure Blob Storage and then when we get the path for this media from a content item we need to find what is the public URL of this media in Azure. So the custom implementation for Azure Blob Storage will return http://mystorageaccount.blob.core.windows.net/mycontainer/myblob. The next step would be to remove the whole IMediaFileStore interface. Therefore we don't have to care about where publicly the media is accessible.What about serving the Blob Storage from our web server? When we go in /media/myimage.png, the path will be: "myimage.png". In case of an Azure Blob Storage, the public URL will be http://mystorageaccount.blob.core.windows.net/mycontainer/myimage.png. This is the URL, where the browser finds the image. When /media/myimage.png is requested, Orchard will download the blob (corresponding to that from Azure, and either render it directly on the request or save it as a cache locally) and serve it for the next request without having to ask for Azure. In terms of perf, it won't be slow and it opens other possibilities: 1. Resizing images If we do a resize, we could use the following URL: http://mystorageaccount.blob.core.windows.net/mycontainer/myimage.png?width=123 But this won't work, because if we do something like this, the server of Azure doesn't know about ImageSharp or whatever. This thing can only be done if we server the image by ourself. To be able to resize images, we need to process them, that means we need to load them and serve them not from a public URL. 2. CDNs Content Delivery Networks are local caches of the files we request. Some people use Azure Blob Storage because they want CDNs. But we can use CDNs even for our local images. The idea is to use CDNs even for Blob Storage. We could say that yes, we have Blob Storage, but just for storage, it's not for serving the images. We could also make it completely private, so nobody can access our Azure Blob Storage. It's the Orchard web server that will download the media, serve it in a way (/media/images/thumbnail.png) and if we have a CDN, then the CDN itself is responsible for asking us for the media (which will download from Blog Storage, so it will be slower for the first time), but then every time the users will hit the CDN, then they will get the image from the CDN, not from us. We won't even serve the image. Instead of having an interface, that gives us a public URL, every time we render a media is to have a configuration setting with the public CDN prefix for media files. In this configuration, we would define //myownsite.azurecdn.com. What you would do is configure Azure CDN to be a CDN on your website which is mywebsite.com. And whenever we render a media file, we would prefix the URL with that. The browser will ask the CDN for the resource, which will itself ask our site for the resource and then get the blob storage thing. We serve it, that means it will be resizeable, even with a CDN. If we make a request like //myownsite.azurecdn.com/foo.png?width=123, it will request that on our server, so we can resize everything. That would work with any CDN, like Azure CDN, Akamai, Horizon, CloudFlare, etc. Another option is to add a configuration setting with public CDN for resources. When we define a resource, we can set the debug version and the minified version, and also the CDN version. And we also have a setting to say I want to use a CDN version of my resources instead of the local ones (if they are available). We could also be able to set the CDN prefix for these files too, and then they would be also cached by a full CDN and the site would be much faster. However, we need to purge ImageSharp cache automatically with some thresholds. If we cache media items, need to have a way to purge. That's doable because every time we store a media we can store how much data we already stored like in a file that is also on the file system. There are many ways to do that. There is a website using the Blog recipe under sebastienrosdotcom.azurewebsites.net. It's hosted on the east coast, if we look at the Network tab using Google Chrome Developer Tools, it takes about 150 ms to render the page in Hungary, plus the static files, which are either in CDN or loaded by Orchard Core. Seb enabled the CDN and mapped this website to cdn.sebastienros.com. In the first time, it will be slower, but after if you hit F5, it takes less ms. On Lombiq Orchard Dojo Newsletter Now we have 56 subscribers of the Lombiq's Orchard Dojo Newsletter! We have started this newsletter to inform the community around Orchard with the latest news about the platform. By subscribing to this newsletter, you will get an e-mail every time when a new post published to Orchard Dojo, including This week in Orchard of course. Do you know of other Orchard enthusiasts who you think would like to read our weekly articles? Tell them to subscribe here! If you are interested in more news around Orchard and the details of the topics above, don't forget to check out the recording of this week's Orchard meeting!