I am trying to rebuild core/image block to add extra link in the caption, which would be a link to the extended description of object in the image on another page.
This requires both modifying block edit interface, as well as saved markup. So I opted to take core/image block from github (and necessary dependency in embed folder).
After little modifying of block (removing unneded exports in index.js of the block and adding registerBlock - because block registering for Gutenberg is done for all core blocks in single js file), block compiles fine. However, in the Wordpress Gutenberg editor, block throws an error. Error is:
Uncaught TypeError: Object(...) is not a function
I tracked down error to useBlockProps hook, which is undefined in javascript, although it is imported before (import { BlockAlignmentToolbar, BlockControls, BlockIcon, MediaPlaceholder, useBlockProps } from '#wordpress/block-editor';) I am using #wordpress/create-block scaffold and mentioned imports resolve through webpack.
Why am I getting an error an how to fix it?
I discovered that I used master branch of Github, where I took core/image block source. Obviously, useBlockProps is yet not part of the core (or not implemented in #wordpress/create-blocks webpack setup).
After switching to wordpress 5.5 Gutenberg branch version of image block, everything was fine.
Related
I need to customize panel templates in my theme, which I use redux. I copied ReduxCore->templates->panel folder into mythemefolder->redux-framework->ReduxCore->templates->panel.
For some plugins, this overrides the templates from plugin, but not the case here, I found that I need to manually tell redux to look for the templates elsewhere other than default folder inside plugin. but I'm not sure how to do it.
I tried adding 'templates_path' => dirname(__FILE__).'/templates/panel', inside redux config file, but it just throws an error with Parse error: syntax error, unexpected '=>' (T_DOUBLE_ARROW)
then I found in redux docx,(https://docs.reduxframework.com/core/advanced/filter-hooks/) that there's another way to put redux/{opt_name}/panel/templates_path, but it has no reference how, or where to put this code.
can anyone help me out please?
https://docs.redux.io/guides/advanced/panel-templates.html
Redux::setArgs('opt_name', array('templates_path'=> dirname(__FILE__).'/templates/panel/'));
That SHOULD do it.
Hello I am using compodoc 1.1.5 to generate the documentation for my angular project. Compodoc provides the ability to override the template by using the option --template folder_name. I tried to override the menu partial by creating a partial folder and putting a menu.hbs in it with the code from the original menu.hbs (the menu disappeared completely) even if I do not modify the original code. I am getting this error
Uncaught SyntaxError: Invalid or unexpected token menu-wc.js:34
Does any one have any idea about the proper way to override templates
Either create your own theme or create an additional doc folder.
The additional docs folder will accept .md and .html files.
See https://compodoc.app/guides/usage.html for more.
I am upgrading a 3.x site to 4.x. All seemingly going fine and this morning I could actually load my site after upgrading the core framework and other modules.
I have just been through the Upgrading process found here and completed the part where I namespace all custom files in /mysite. Which I have done, with the exception of Page.php and PageController.php.
The issue I am having is since doing this namespacing, no page can find any template in the system. All pages use /framework/templates/SilverStripe/Control/Controller.ss (confirmed by markup in the source).
There is some very brief discussion in the upgrade doc that goes into templates, but very little. And I've spent the day trying to find tutorials on what the docs might mean by the incomplete statement:
Core template locations have moved - if you’re including or overriding these (e.g. for FormField templates) please adjust to the new paths.
(It's incomplete because it doesn't go on to say what "new paths" actually are.)
If you have a file /mysite/code/Page.php (with no namespace), would you expect the template in /mysite/template/Page.ss to load? In my case, it doesn't. If you had another page called HomePage that extended Page.php, but had the namespace Vendor\MySection, where would you expect to find the template in the file system?
Edit: Example of what is not working:
Page.php - no namespace
HomePage.php - namespace Vendor\MyProject
I have tried the following structure in both my /themes/[themename]/templates directory and /mysite/templates directory:
Page.ss
Vendor
MyProject
Layouts
HomePage.ss
In either case, neither the Page.ss template, or the HomePage.ss template is picked up. The page is presented by Controller.ss.
The only way I have got this to work is by removing namespacing from ALL pages and following the structure normally found in SS3.
Edit 2: Just the contents of my config.yml
SilverStripe\View\SSViewer:
themes:
- 'mytheme'
- '$default'
The templates should also be "namespaced";
The template dir in my latest SS4 project looks like
templates
Page.ss: global site structure incl. head and body tags
Layout
Page.ss: $Layout of Page.php
Includes
Header.ss
...
Vendor: my project's name
Includes: stuff that gets included in other templates
PageGallery.ss: gets included via <% include Vendor/PageGallery %>
Pages: for Vendor\Pages Namespace
Layout
FooPage.ss: for Vendor\Pages\FooPage class which gets used for $Layout in the global template
TBH the first try was a lot of WTF and trial and error
I am using Magnolia CMS 5.3.4, the STK, and freemarker (FTL) template scripts.
Some components I have defined relies on specific javascript files. Right now, what I do is that I include these javascript files in the main.ftl template script. I am looking for a way to get them included only if the specific component is present on the page.
I tried to use the jsFiles property in Template Definitions, but it seems it works only for page template definition.
The jsFiles property indeed works only for pages not for components. This is because Magnolia wants to include those files in header already, rather than loading them in middle of the body when component gets rendered.
As a general practice I would anyway recommend combining your js files into one (look at for example plugin loader in resources on how this is done) and set longer time for caching such file so that browser downloads all the script just once for the whole site rather then page by page. The bigger js file you are sending over the more overhead you are cutting off from requesting separate files and better the compression of content for transport will work.
HTH,
Jan
I get an error as soon as I add jQuery and Bootstrap. The three files that I add are
1) a_jquery-1.11.2.min.js // so that it is processed before 'b' in bootstrap
2) bootstrap.min.css
3) bootstrap.min.js
and they are located in /lib.
If I add bootstrap without jQuery, I get an error saying that Bootstrap needs jQuery. After I add jQuery I get the following error messages.
/Users/username/.meteor/packages/meteor-tool/.1.0.40.cbg34i++os.osx.x86_64+web.browser+web.cordova/meteor-tool-os.osx.x86_64/dev_bundle/server-lib/node_modules/fibers/future.js:173
throw(ex);
^
TypeError: Cannot call method 'createElement' of undefined
at jb (app/lib/a_jquery-1.11.2.min.js:2:7547)
at app/lib/a_jquery-1.11.2.min.js:2:22045
at app/lib/a_jquery-1.11.2.min.js:2:22746
at c (app/lib/a_jquery-1.11.2.min.js:2:207)
at app/lib/a_jquery-1.11.2.min.js:2:212
at app/lib/a_jquery-1.11.2.min.js:6:3
at /Users/username/my_app/.meteor/local/build/programs/server/boot.js:205:10
at Array.forEach (native)
at Function._.each._.forEach (/Users/username/.meteor/packages/meteor-tool/.1.0.40.cbg34i++os.osx.x86_64+web.browser+web.cordova/meteor-tool-os.osx.x86_64/dev_bundle/server-lib/node_modules/underscore/underscore.js:79:11)
Does anyone know what I am missing?
EDIT: I also have a question about including the stylesheets. I include a CDN bootstrap in /client/views/layout.html but as soon as I delete the importing line and save a local bootstrap.min.css file in /lib the styles start breaking. Why does this happen?
The /lib folder is for shared code, putting client-side frameworks in it will cause you a lot of trouble since Meteor will try to run it on the server too (and miserably fail at finding a window object). Place any client-only code in the client folder instead.
Plus, I would suggest taking a look at packages rather than doing it yourself, a lot of people have already done what you're going through.
If you want to have local style sheets, either put them in the client folder (loaded immediately) or in the public folder (for delayed loading via an import). More about special folders in the documentation.
You can't put them in /lib since anything in there is also loaded by the server. /client/lib would be okay.
Note also that you don't need jQuery, that comes by default (it's used by Blaze).
Finally, I'd recommend using a bootstrap package. If you use this one then you'll by able to make use of all the mixins and also change the base varaibles cleanly. See this article for more information.