Invision Community 4: SEO, prepare for v5 and dormant account notifications Matt November 11, 2024Nov 11
Posted March 6Mar 6 I am currently using XenForo and am planning to migrate to IPB the new version 5.0.x as I find it quite impressive. However, I have a thought that if I migrate here, my forum layout font will be broken. Because my forum is Urdu based, and all the content is written in Jameel Noori Nastaleeq font.I noticed that the editor of the new version does not have the option to add custom fonts. Is there any way to add Jameel Noori Nastaleeq to the editor? Or at least make sure that all Urdu posts appear in Jameel Noori Nastaleeq font on both desktop and mobile?If it is possible, please guide me on how to implement it so that I can proceed with the purchase and migration of my forum. Can we add Urdu font to the editor? If yes, please explain the method, as I would like to try it on the trial version first.
March 6Mar 6 Community Expert Hello,Adding fonts to the editor is possible by using the editor extension system. You can read more about that here
March 6Mar 6 Community Expert Just to ensure you are aware, if you are doing the development yourself you would need a self-hosted/classic license to develop with
March 7Mar 7 Community Expert Hello,By default, the editor will use whatever font has been assigned to the body element (controlled by your CSS code). If you're using the Jameel Noori Nastaleeq font for every piece of text in your community (including a language pack), then changing the font on your body element should hopefully make everything work for you.If you need a mixture of both Urdu and other languages in your posts though, then adding the font to the editor (and switching to it only when necessary) would be safest.
March 8Mar 8 Author Just to ensure you are aware, if you are doing the development yourself you would need a self-hosted/classic license to develop withAbsolutely, I will need to purchase a Self-Hosted License, and I am ready to do so. However, I do not want to make any changes to my forum’s font or layout, which is why I want to fully confirm beforehand that this can be implemented successfully.I would like to first apply and test this feature on the trial version before proceeding further. If this is possible, please guide me on how I can achieve it and which files need to be modified.My main requirements are:The Jameel Noori Nastaleeq font should appear in the editor’s font list, allowing users to select and post directly in this font.ORAll Urdu text should automatically be displayed in Jameel Noori Nastaleeq, while English text remains in the default font.If either of these options is possible, please provide detailed instructions so I can test it on the trial version before making a final decision. Hello,By default, the editor will use whatever font has been assigned to the body element (controlled by your CSS code). If you're using the Jameel Noori Nastaleeq font for every piece of text in your community (including a language pack), then changing the font on your body element should hopefully make everything work for you.If you need a mixture of both Urdu and other languages in your posts though, then adding the font to the editor (and switching to it only when necessary) would be safest.Thank you for your explanation. I want Jameel Noori Nastaleeq to be available as a selectable font in the editor so that users can choose it when needed. Alternatively, I would like to set it as the default Urdu font for the entire forum, ensuring it displays correctly on mobile devices as well.Could you please explain how to add a new font to the editor’s font list?Which files need to be modified?Will this require additional coding or a plugin?I want to test this feature on the trial version before proceeding with the purchase. Please provide detailed instructions so that I can implement and test it.Thank you!
March 10Mar 10 Community Expert Hello,This is not something you will be able to do on the trial version, as i requires custom development to achieve. How to actually add them is shown in the document I linked above for adding them to the editor. This does require access to files, which is not something you can do on the trial version.
March 10Mar 10 Community Expert Using the unicode-range property, it might be possible to automatically render any Urdu text using your custom font, without needing to manually select the font from the editor.Once you have created a trial/demo forum, post some example content on there (in a mixture of English and Urdu) and send me the URL. I’ll take a look and see if the unicode-range solution works.
March 19Mar 19 Author As I said I cannot compromise on the font layout of my forum. Because this font in Urdu is more beautiful and easy to read than all the other fonts. But at the same time I want to migrate to this software. And as you said it is not something that can be checked on the trial version. So if I buy the license which is worth $499 and this font does not work or for some reason it does not work on mobile and desktop. So will I get my money back. Because then I will not be able to migrate here. Or will I have to risk this payment just for confirmation.Or can we check it on any nulled version and proceed? And after checking it, we can migrate here with the license. Hello,This is not something you will be able to do on the trial version, as i requires custom development to achieve. How to actually add them is shown in the document I linked above for adding them to the editor. This does require access to files, which is not something you can do on the trial version. Using the unicode-range property, it might be possible to automatically render any Urdu text using your custom font, without needing to manually select the font from the editor.Once you have created a trial/demo forum, post some example content on there (in a mixture of English and Urdu) and send me the URL. I’ll take a look and see if the unicode-range solution works. Edited March 19Mar 19 by Khan Nabeel Khan
March 19Mar 19 Community Expert The issue you have here is you are asking about custom development for the tiptap editor. You can indeed develop your own plugin solutions for the tiptap editor on he software, however you are asking for someone to tell you what and how to do this. I want to test this feature on the trial version before proceeding with the purchase. Please provide detailed instructions so that I can implement and test it.While we can provide basic documentation on what you need to develop your own solutions on top of our platform, its not feesable for us to provide specific code/solutions. We don't provide customisation itself. It is not possible to provide a downloadable version of the software, unfortunately.
March 19Mar 19 Community Expert You may have missed my earlier reply. If you can send me a URL of your demo board with posts that contain both English and Urdu, I will try my best to help.
March 20Mar 20 Author You may have missed my earlier reply. If you can send me a URL of your demo board with posts that contain both English and Urdu, I will try my best to help.Here is the URL for the demo. If you can help, I will also join this community. A Test Forum - Invision Community
March 22Mar 22 Community Expert I've added some code to your Custom CSS area which changes the font for Urdu characters. It seems to work, but my knowledge of these characters is incredibly low, so I'll wait for you to double check.You can choose to self-host the woff2 file too, which would be better for performance.@font-face { font-family: "Jameel Noori Nastaleeq"; src: url("https://db.onlinewebfonts.com/t/0f64bc9fbd20b8f7ddb4ea11756cbbb7.woff2") format("woff2"); unicode-range: U+0600-06FF; /* Urdu range */ font-display: swap; } body { font-family: "Jameel Noori Nastaleeq", var(--i-font-family); }The font is quite large (almost 5MB), so loading it for the first time might take a few seconds. Consecutive page loads should be faster.
March 22Mar 22 Author I've added some code to your Custom CSS area which changes the font for Urdu characters. It seems to work, but my knowledge of these characters is incredibly low, so I'll wait for you to double check.You can choose to self-host the woff2 file too, which would be better for performance.@font-face { font-family: "Jameel Noori Nastaleeq"; src: url("https://db.onlinewebfonts.com/t/0f64bc9fbd20b8f7ddb4ea11756cbbb7.woff2") format("woff2"); unicode-range: U+0600-06FF; /* Urdu range */ font-display: swap; } body { font-family: "Jameel Noori Nastaleeq", var(--i-font-family); }The font is quite large (almost 5MB), so loading it for the first time might take a few seconds. Consecutive page loads should be faster.Ok. I am checking it on the demo. It is indeed showing the Urdu font on the desktop. But it is showing all the Urdu text in the default left alignment. Which has to be done manually right alignment. And also in the text box, when I write Urdu and post, it shows the post in the left side alignment. Whereas it should start from the right side according to Urdu. That is, when Urdu is written in the editor box, it should be aligned on the right side according to the Urdu setting. Whereas it should not have any effect on the English text. So that the English text and layout are not damaged.
March 22Mar 22 Community Expert I don't have a solution for automatically aligning Urdu text to the right. This isn't a limitation with Invision, but just a limitation with HTML/CSS in general.Since you'll have a mix of English in LTR and Urdu in RTL, you'll need a way to manually toggle the "RTL" direction. The most accessible way to do this is by using the lang attribute, but that would require a custom button in your text editor to achieve that. The result would ideally look like:<p lang="ur">یہ ایک مثال ہے۔</p>This CSS would then be responsible for the RTL layout:[lang="ur"]{ direction: rtl; }