Adding image in the <title> for all pages - java

I am able to add an image as part of my web application title but what I need to know is that, if there is a way in CSS or any other way to set this image for all the pages at once instead of adding it in the head tag for each and every page.
<link rel="shortcut icon" href="../images/favicon.ico" />
Thanks

You can have that link tag inside another .jsp file and include it anywhere you like writing <%#include file="includes/header.jsp" %>.
header.jsp will contain the favicon and maybe css that you want to use everywhere:
<link rel="shortcut icon" href="../images/favicon.ico" />
Using this include pattern you avoid repeated code and having to edit lots of files if your favicon url changes. A great example to illustrate this is to have a .jsp file for the navigation and include it everywhere in your website. This way if you want to add another page to the navigation you just have to edit one file.

You'll need to use php include, cause you can call it in every page and you only need to code it one time...
For example, you write your head with php extension(head.php) and then you use on your pages
include 'sourcefile/head.php';
then everything that you coded will be post there.
hope it helps

Related

Phalcon stylesheets and javascript don't load for non-base routes

My problem is about stylesheets and javascript that aren't loading when I'm using a second / in my URL.
When I use <link rel="stylesheet" href="stylesheets/theme.css" /> it works for my base route but stops working when I go deeper, such as /home/webpage.
These are the errors I am getting in my Chrome console:
Refer to this stack overflow question
Essentially you need an assets manager. You can then load this assets manager in your main layout (if you have one) and have your other views extend your main layout.

How should I include other jsp files in a jsp file and why?

So there seems to be a few ways to include jsp files in jsp files, being:
<%# include file="header.jsp" %>
<jsp:include page="header.jsp" />
<c:import url="header.jsp" />
<tagfiles:tagfile />
So which one should I use and why? What advantages / disadvantages do they come with?
The include directive, makes a copy of the included page and copies it into a JSP page (the "including page") during translation. This is known as a static include (or translate-time include) and uses the following syntax:
<%# include file="/jsp/userinfopage.jsp" %>
Two alternatives exist for the dynamic include
The jsp:include tag, described in "Standard Actions: JSP Tags", dynamically includes output from the included page within the output of the including page during execution. This is known as a dynamic include (or runtime include) and uses the following syntax:
<jsp:include page="/jsp/userinfopage.jsp" flush="true" />
<c:import url="header.jsp" />
Unlike jsp:include, the c:import action provides a mechanism to access resources that can be specified through a URL, thus allowing page authors to get access to resources that reside outside the Web application. On the other hand, it lacks the ability to flush the response. Finally, c:import is comparatively more heavyweight and is therefore not appropriate when a lightweight solution is sought.
tagfiles are basically templates, which are like generic and can render some common views, but internally they will themselves use html tags itself.but not much of use while including jsp pages.
In my Project, I have used following approach
<jsp:include page="header.jsp" />
I have used this for loading specific div element instead of refreshing whole page.
This can be done by using JQuery's load method.
Including JSP file allows us to reuse the template in many places. Just write template code in JSP file and use it wherever required.
JSP page directives works at translation time while standerd actions works at run time.
You can tagfiles for calling functions on server side. You can also use tagfiles for creation of templates.

Change element in Jquery datepicker

Good day all,
I have follow this website (http://jqueryui.com/datepicker/) to create a datepicker using jQuery.
The datepicker was successfully created, however, my datepicker is not fully same as the datepicker in the website. The following is my screen shot :
Datepicker in the website:
Datepicker in my environment:
In my environment, I do not have the "Left" and "Right" icon. I have tried to edit the js file and the css file, however, it doesn't take effect.
Start edit here : I just found out 1 things few hours ago.
When I write my code as follows, it works:
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
However, if I copy those code and put in my physical folder, and I change the href url as follows, the left and right icons are gone:
<link rel="stylesheet" href="jquery-ui.css">
I copy 100% of the css code and paste it correctly, named it correctly, path correctly, not understand why I get that problem.
Kindly advise.
This is happening because you already have your custom css that is overriding the datepicker css values. You just need to declare the date picker CSS at the bottom of your cascade i.e just after your CSS and your things will work just fine.
Finally, I get what is the problem.
The problem is, I need to download an png file which is call ui-icons_222222_256x240.png, and then put it into a folder name images.

Wicket - <wicket:link> - How to put pages in different packages?

I have a web app, and it has a directory structure like:
/com/myproject/MyPage.java
/com/myproject/MyPage.html
/com/myproject/resources/styles.css
/com/myproject/resources/bg.png
In MyPage.html I have code like:
<wicket:link>
<link rel="stylesheet" type="text/css" href="resources/styles.css"/>
</wicket:link>
The CSS file has references like url(bg.png). And all is good.
However, my app is now getting so big (I have about 15 pages so far), I don't want to put all the pages and HTML in one directory. However things like "styles.css" are referenced from all pages. So I would like to create various packages for various groups of pages, but still have "styles.css", and the images etc. that it references, existing only once in my source tree.
I would like to do something like:
Create e.g. /com/myproject/usermanagement/UserManagementStartPage.java
but still have /com/myproject/resources/styles.css (with the intention of sharing that between all pages)
The HTML still references the CSS with a <wicket:link>, e.g. href="../resources/styles.css"
Or even better, have an absolute link to the css e.g. href="/com/myproject/resources/styles.css (that way when I move a page from one package to a deeper/shallower package, I don't have to change the number of ...)
Am I thinking along the right lines? How would you approach this problem?
You need something like:
<wicket:link>
<link rel="stylesheet" type="text/css" href="$up$/resources/styles.css"/>
</wicket:link>
org.apache.wicket.settings.IResourceSettings.setParentFolderPlaceholder("$up$")
This way the url will look like /com/myproject/usermanagement/$up$/resources/styles.css and Wicket will resolve the parent folder for you.
Wicket handles CSS file links that are relative to the root of the web app. That way, it doesn't matter if you move a markup file one level higher or deeper. It is also possible to include style sheets from Java code, as explained
in this article . Using markup inheritance, you can just add your style sheet to your base page and let your real pages inherit from it.

CSS design templates

I'm about to develop a j2ee web application . I need to know , how can I have the different designs (layout of CSS) for jsp pages . Say If I send the same data always but I want to present that data in different web designs ( web page designs) .
So that I can navigate through the designs more flexibly and choose the best one for my applications.
My need is , with out changing the content related to design in jsp page , (like classname's , id 's related to CSS for different textboxes and lables.. etc) , instead I'll change only one attribute in my application so that whole design would change.
Can any one suggest where can I find these sets of web layouts (CSS layouts).
What you're looking for then is the 960.gs grid system. :)
It provides.. "..a streamlined web development workflow by providing commonly used dimensions..". which is what you have asked for in your question.
I agree with another poster about having separate CSS Style Sheets (external style sheets).
Have you checked out CSS Zen Garden? There's probably more than a hundred different web pages that all use the same HTML, but changed the CSS & image files only. That's what opened my eyes to what CSS can do.
If i understand your question correctly, one way to accomplish changing layout without changing classes and ids is to have separate stylesheets for each layout.
You can then select the desired stylesheet in the header of the html file being served.
i.e
layout 1:
<link rel="stylesheet" type="text/css" href="layoutOne.css" />
layout 2:
<link rel="stylesheet" type="text/css" href="layoutTwo.css" />
Finally I reached below link . It sounds great
http://www.oswd.org - You can download from this site many number of designs.
I agree the answer on zengarden , here is the URL http://www.mezzoblue.com/zengarden/alldesigns/

Categories

Resources