Magnolia CMS Page dialog empty - magnolia

I've created a page-template with mgnl create-page hello. The command run successfully, and created the necessary files:
templates/pages/hello.yaml
dialogs/pages/hello.yaml
templates/pages/hello.ftl
When I create a page, a form appears with seemingly the correct fields.
But when I try to edit the page, the page editor box is empty.
Even though the .ftl file contains [#cms.page /] in the head element.
File contents of hello.ftl:
<!DOCTYPE html>
<html xml:lang="${cmsfn.language()}" lang="${cmsfn.language()}">
<head>
[#cms.page /]
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>${content.windowTitle!content.title!}</title>
<meta name="description" content="${content.description!""}" />
<meta name="keywords" content="${content.keywords!""}" />
[#-- To load resources you can link them manually (e.g. line below) --]
[#-- <link rel="stylesheet" type="text/css" href="${ctx.contextPath}/.resources/module-name/webresources/css/bootstrap.css" media="all" /> --]
[#-- <script src="${ctx.contextPath}/.resources/module-name/webresources/js/jquery.js"></script> --]
[#-- or via theme --]
[#-- [#assign site = sitefn.site()!] --]
[#-- [#assign theme = sitefn.theme(site)!] --]
[#-- [#list theme.cssFiles as cssFile] --]
[#-- [#if cssFile.conditionalComment?has_content]<!--[if ${cssFile.conditionalComment}]>[/#if] --]
[#-- <link rel="stylesheet" type="text/css" href="${cssFile.link}" media="${cssFile.media}" /> --]
[#-- [#if cssFile.conditionalComment?has_content]<![endif]-->[/#if] --]
[#-- [/#list] --]
[#-- [#list theme.jsFiles as jsFile] --]
[#-- <script src="${jsFile.link}"></script> --]
[#-- [/#list] --]
[#-- uncomment next line to use resfn templating functions to load all css which matches a globbing pattern --]
[#-- ${resfn.css(["/module-name/.*css"])!} --]
</head>
<body class="hello ${cmsfn.language()}">
<div class="container">
<h1>hello works!</h1>
</div>
[#-- use resfn to load all js which matches the globbing pattern or link resources manually or via theme --]
[#-- ${resfn.js(["/module-name/.*js"])!} --]
</body>
</html>
File contents of hello.yaml:
title: hello
templateScript: /module-name/templates/pages/hello.ftl
renderType: freemarker
dialog: module-name:pages/hello
visible: true
How can I see make the Page dialog "visible"?

Try this:
mgnl create-component test --available hello#main
Then edit
templates/pages/hello.ftl
To move the last line
[#cms.area name="main"/]
to just above the </body> tag.

Related

WordPress Header Code Generates Both https and http for Stylesheet and JavaScript files

We are using WordPress Twenty Fourteen theme. The page header code generated for mobile devices shows file sources from both http and https. Later Newer Apple devices are blocking these files from loading.
<link rel='stylesheet' id='twentyfourteen-lato-css'
href='https://fonts.googleapis.com/css?family=Lato%3A300%2C400%2C700%2C900%2C300italic%2C400italic%2C700italic&subset=latin%2Clatin-ext&display=fallback'
media='all' />
<link rel='stylesheet' id='genericons-css'
href='http://wordpress.wwfry.org/wp-content/themes/twentyfourteen/genericons/genericons.css?ver=3.0.3'
media='all' />
<link rel='stylesheet' id='twentyfourteen-style-css'
href='http://wordpress.wwfry.org/wp-content/themes/twentyfourteen/style.css?ver=20190507' media='all' />
<link rel='stylesheet' id='twentyfourteen-block-style-css'
href='http://wordpress.wwfry.org/wp-content/themes/twentyfourteen/css/blocks.css?ver=20190102' media='all' />
<!--[if lt IE 9]> <link rel='stylesheet' id='twentyfourteen-ie-css' href='http://wordpress.wwfry.org/wp-content/themes/twentyfourteen/css/ie.css?ver=20140701' media='all' /> <![endif]-->
<link rel='stylesheet' id='fh-buttons-css' href='https://fh-kit.com/buttons/v2/?green=26890d' media='all' />
<link rel='stylesheet' id='tablepress-default-css'
href='http://wordpress.wwfry.org/wp-content/plugins/tablepress/css/default.min.css?ver=1.14' media='all' />
<script src='http://wordpress.wwfry.org/wp-includes/js/jquery/jquery.min.js?ver=3.6.0' id='jquery-core-js'></script>
<script src='http://wordpress.wwfry.org/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.3.2'
id='jquery-migrate-js'></script>
<link rel="https://api.w.org/" href="https://www.wwfry.org/index.php?rest_route=/" />
<link rel="alternate" type="application/json" href="https://www.wwfry.org/index.php?rest_route=/wp/v2/pages/8" />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://wordpress.wwfry.org/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml"
href="http://wordpress.wwfry.org/wp-includes/wlwmanifest.xml" />
<meta name="generator" content="WordPress 5.8.1" />
<link rel='shortlink' href='https://www.wwfry.org/?p=8' />
<link rel="alternate" type="application/json+oembed"
href="https://www.wwfry.org/index.php?rest_route=%2Foembed%2F1.0%2Fembed&url=https%3A%2F%2Fwww.wwfry.org%2F%3Fpage_id%3D8" />
<link rel="alternate" type="text/xml+oembed"
href="https://www.wwfry.org/index.php?rest_route=%2Foembed%2F1.0%2Fembed&url=https%3A%2F%2Fwww.wwfry.org%2F%3Fpage_id%3D8&format=xml" />
<style type="text/css" id="twentyfourteen-header-css">
.site-title a {
color: #ffffff;
}
Header code generated for desktop / PC devices requests all files using https.
To fix the problem I checked the following:
In WP general settings I verified that the WordPress Address and Site Address both used https.
I check the header.php, functions.php and theme.php files for any custom coding and found none.
See the website at wwfry.org. Any help debugging this issue would be appreciated.

asp.net minified css files in fonts- and images folder

I'm experiencing something (that i think is) very weird.
I'm running an ASP.net application, and I have no problems on the development build, but on the production build when minifying, the files are not found. When inspection the application in the browser, the two files not found, site.min.css and bootstrap.min.css, are residing in the Images- and the Fonts-folder respectively.
Please see screenshot below
[
{
"outputFileName": "wwwroot/css/site.min.css",
"inputFiles": [
"wwwroot/css/site.css"
]
},
{
"outputFileName": "wwwroot/lib/bootstrap/dist/css/bootstrap.min.css",
"inputFiles": [
"wwwroot/lib/bootstrap/dist/css/bootstrap.css"
]
},
]
And when included in the _Layout.cshtml:
<environment names="Development">
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="~/css/site.css" asp-append-version="true" />
</environment>
<environment names="Staging,Production">
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="~/css/site.min.css" asp-append-version="true" />
</environment>
And folder structure:
Any help is appreciated.

Rendering style bundles bundles not the same as style links

I have an ASP.NET MVC application that uses the Metronic template from keenthemes.
When i use bundles in my layout for my css , it doesnt work well. Most of the icons do not appear
If i switch to direct links then everything is ok.
Javascript is ok.
Bundles config and layout use:
bundles.Add(new StyleBundle("~/bundles/metronic-app").Include(
"~/assets/global/plugins/font-awesome/css/font-awesome.min.css",
"~/assets/global/plugins/simple-line-icons/simple-line-icons.min.css",
"~/assets/global/plugins/uniform/css/uniform.default.css",
"~/assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css",
"~/assets/global/css/components.css",
"~/assets/global/css/plugins.css",
"~/assets/admin/layout2/css/layout.css",
"~/assets/admin/layout2/css/themes/default.css",
"~/assets/admin/layout2/css/custom.css"));
#Styles.Render("~/bundles/metronic-app")
Direct links:
<link href="~/assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/global/plugins/uniform/css/uniform.default.css" rel="stylesheet" type="text/css">
<link href="~/assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css" />
<!-- END GLOBAL MANDATORY STYLES -->
<!-- BEGIN THEME STYLES -->
<link href="~/assets/global/css/components.css" rel="stylesheet" type="text/css" />
<link href="~/assets/global/css/plugins.css" rel="stylesheet" type="text/css" />
<link href="~/assets/admin/layout2/css/layout.css" rel="stylesheet" type="text/css" />
<link id="style_color" href="~/assets/admin/layout2/css/themes/default.css" rel="stylesheet" type="text/css" />
<link href="~/assets/admin/layout2/css/custom.css" rel="stylesheet" type="text/css" />
Here are the errors from chrome console:
I should have been using the CssrewriteUrlTransform class in my bundle configuration in order to make the asset's paths absolute.
What worked is this:
bundles.Add(new StyleBundle("~/bundles/metronic-app").Include(
"~/assets/global/plugins/uniform/css/uniform.default.css",
"~/assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css",
"~/assets/global/css/components.css",
"~/assets/global/css/plugins.css",
"~/assets/admin/layout2/css/custom.css")
.Include("~/assets/admin/layout2/css/layout.css", new CssRewriteUrlTransform())
.Include("~/assets/admin/layout2/css/themes/default.css", new CssRewriteUrlTransform())
.Include("~/assets/global/plugins/font-awesome/css/font-awesome.min.css", new CssRewriteUrlTransform())
.Include("~/assets/global/plugins/simple-line-icons/simple-line-icons.min.css",new CssRewriteUrlTransform()));
Hint from this SO Question

Codeigniter CSS and Javascript files usage

I am writing a webpage with CI.I use the latest version. I need to learn how to imply CSS and Javascript files. I use nivoslider , jquery and many css files. I use application directory as
+application
+views
+pages
-home.php
+templates
-header.php
-footer.php
+system
+user_guide.
Can you explain how to enable js and Css files. I made a research but my mind is blown away with the versions of codeigniter.
this is my header.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN
""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Kırmızı Eğitim Merkezi</title>
<meta name="description" content="Empire - XHTML Template" />
<!-- CSS -->
<link href='./fonts/sansation.css' rel="stylesheet" type="text/css" />
<!-- Get any font from here easily: http://www.google.com/webfonts -->
<link href="./css/style.css" rel="stylesheet" type="text/css" />
<link href="./fancybox/jquery.fancybox-1.3.4.css" rel="stylesheet"
type="text/css" />
<link href="./css/nivo-slider.css" rel="stylesheet" type="text/css" />
<!-- UPDATE BROWSER WARNING IF IE 7 OR LOWER -->
<!--[if lt IE 8]><link href="css/stop_ie.css" rel="stylesheet"
type="text/css" /><![endif]--><!-- JAVASCRIPTS -->
<script type="text/javascript" src="./js/jquery.min.js">
</script><script type="text/javascript"
src="./js/jquery-ui-1.8.17.custom.min.js">
</script><script type="text/javascript"
src="./fancybox/jquery.fancybox-1.3.4.pack.js">
</script><script type="text/javascript" src="./js/jquery.nivo.slider.js">
</script><script type="text/javascript" src="./js/jquery.bgslider.js">
</script><script type="text/javascript" src="./js/preloader.js">
</script><script type="text/javascript" src="./js/farbtastic.js">
</script><script type="text/javascript" src="./js/basic.js">
</script>
Can you advice me a way to use them ?
First, you need to place JS and CSS files somewhere like:
+ assets
+ js
+ css
Then you need to call them:
<link href='<?php echo base_url(); ?>assets/css/cssfile.css' rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/jquery.min.js">

Explorer not loading conditional style-sheet in Wordpress site

I have a wordpress site I am using ie conditional comments to load in an ie specific stylesheet in to. For some reason the changes made aren't being reflected in IE's rendering:
I have tried:
clearing browser history
deleting and re-uploading the file
ensuring the conditional comment is correct
closing all browsers and restarting
checking the file path
Adding php style now() to force refresh
And I've reached a point where I'm baffled.
What else can I try?
edit:
the code:
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<title>K9 Heaven - 21st Century Dog Care</title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="stylesheet" type="text/css" media="all" href="http://www.k9heaven.org.uk/wp-content/themes/k9_0.2/style.css" />
<!--[if IE]>
<link rel="stylesheet" type="text/css" media="all" href="ie.css" />
<![endif]-->
<link rel="pingback" href="http://www.k9heaven.org.uk/xmlrpc.php" />
<!--[if lt IE 9]>
<script src="http://www.k9heaven.org.uk/wp-content/themes/k9_0.2/js/html5.js" type="text/javascript"></script>
<![endif]-->
<link rel="alternate" type="application/rss+xml" title="K9 Heaven » Feed" href="http://www.k9heaven.org.uk/?feed=rss2" />
<link rel="alternate" type="application/rss+xml" title="K9 Heaven » Comments Feed" href="http://www.k9heaven.org.uk/?feed=comments-rss2" />
<link rel="alternate" type="application/rss+xml" title="K9 Heaven » Home Comments Feed" href="http://www.k9heaven.org.uk/?feed=rss2&page_id=49" />
<link rel='stylesheet' id='NextGEN-css' href='http://www.k9heaven.org.uk/wp-content/plugins/nextgen-gallery/css/nggallery.css?ver=1.0.0' type='text/css' media='screen' />
<link rel='stylesheet' id='shutter-css' href='http://www.k9heaven.org.uk/wp-content/plugins/nextgen-gallery/shutter/shutter-reloaded.css?ver=1.3.2' type='text/css' media='screen' />
<script type='text/javascript' src='http://www.k9heaven.org.uk/wp-includes/js/l10n.js?ver=20101110'></script>
<script type='text/javascript'>
/* <![CDATA[ */
var shutterSettings = {
msgLoading: "L O A D I N G",
msgClose: "Click to Close",
imageCount: "1"
};
/* ]]> */
</script>
<script type='text/javascript' src='http://www.k9heaven.org.uk/wp-content/plugins/nextgen-gallery/shutter/shutter-reloaded.js?ver=1.3.2'></script>
<script type='text/javascript' src='http://www.k9heaven.org.uk/wp-includes/js/jquery/jquery.js?ver=1.6.1'></script>
<script type='text/javascript' src='http://www.k9heaven.org.uk/wp-content/plugins/nextgen-gallery/js/jquery.cycle.all.min.js?ver=2.88'></script>
<script type='text/javascript' src='http://www.k9heaven.org.uk/wp-content/plugins/nextgen-gallery/js/ngg.slideshow.min.js?ver=1.05'></script>
<script type='text/javascript' src='http://www.k9heaven.org.uk/wp-includes/js/comment-reply.js?ver=20090102'></script>
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://www.k9heaven.org.uk/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://www.k9heaven.org.uk/wp-includes/wlwmanifest.xml" />
<link rel='index' title='K9 Heaven' href='http://www.k9heaven.org.uk' />
<link rel='prev' title='Contact' href='http://www.k9heaven.org.uk/?page_id=25' />
<meta name="generator" content="WordPress 3.2.1" />
<!-- All in One SEO Pack 1.6.13.3 by Michael Torbert of Semper Fi Web Design[395,435] -->
<meta name="description" content="K9 Heaven - 21st Century Dog Care" />
<meta name="keywords" content="K9,Heaven,21st,Century,Dog,Care" />
<link rel="canonical" href="http://www.k9heaven.org.uk/" />
<!-- /all in one seo pack -->
<meta name='NextGEN' content='1.8.3' />
<style type="text/css">.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important;}</style>
</head>
http://www.k9heaven.org.uk/
Feel free to close this thread, forgot that relative css paths in wordpress themes go to the site root, not the theme root. And won the stupid hat.
Is this
http://www.k9heaven.org.uk/ie.css
the sheet you're tyring to load? or is it this:
http://www.k9heaven.org.uk/wp-content/themes/k9_0.2/ie.css
The code above is referencing the first style sheet at the root of the site. That's non-standard. You should use <?php get_theme_root() ?> in the style sheet link in the theme files to target the style sheet in the theme folder.

Resources