google +1 button not showing up - google-plus-one

I've added the required tags, but it is still not showing. I've added this in head:
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{lang: 'lt', parsetags:'explicit'}
</script>
and this in the body:
<g:plusone href="http://www.fanuspinta.lt/katalogas/lietuva-mar%C5%A1kin%C4%97liai-31"></g:plusone>
At first I thought it didn't show up because I was using a local server, but now it's in production, and still not showing.
URL in case: http://www.fanuspinta.lt/katalogas/lietuva-mar%C5%A1kin%C4%97liai-31
Thanks for any ideas.

I used a html5 tag like shown here without the data-href attribute, dynamically added it afterwards (when the lightbox was loaded) and explicitely loaded the div containing the plusone code at the end.

Related

Having trouble with implementation

I have spent 2 hours + on the lightbox. I have checked paths to CSS and Javascript. I have used both the included jquery and Google's imported JQuery.
When I click an image it opens a new window with that image larger on a white background. I want it to overlay the current page with <> and x.
You can see an example: http://demopbdesignsource.tierstrategies.com/a.aspx
Thanks
Looking at your code on your page I do not see where you are calling the lightbox.js script - that needs to be called right before the body close tag.
Also lightbox help states : If you already use jQuery on your page, make sure it is loaded before lightbox.js. - ◦Include the Javascript at the bottom of your page before the closing /body tag:
I used the lightbox-plus-jquery.js and called that just before the close of the body tag and it worked. I called the lightbox-plus-jquery.js just before the close of the body tag because it has both jquery and lightbox combined.
I am still working on the page and I am just using html not .net but the lightbox would work the same. If you look at my source you will see the script call right before /body tag.
http://just-in.com/recycledDresser/index.htm
Hope this helps.
Debra W.
You need to call the Lightbox script.
Something like
Placing it in the line before the line works for me.
Both
http://demopbdesignsource.tierstrategies.com/X/LightBox.css
and
http://demopbdesignsource.tierstrategies.com/X/LightBox.js
cannot be found.
The link provided in the question is giving 404 right now.
but I think you just need to follow the steps given at
http://lokeshdhakar.com/projects/lightbox2/
to set up lightbox.
you may have missed either of the following :
Include the CSS at the top of your page in your <head> tag:
<link href="path/to/lightbox.css" rel="stylesheet">
Include the Javascript at the bottom of your page before the closing </body> tag:
<script src="path/to/lightbox.js"></script>

Front-end design: Dynamically add items to list

So, I've tried several times to thrust myself into the world of website development. Each time, I have abandoned a project for one simple reason: lists.
I would like to know, from front to back, the dataflow for a system which follows the following sequence of events:
The user is shown a list in a website
The user fills out a new list item in some sort of modal dialog
The user hits "Submit" and that item is now added to the list.
That new list item is sent to the server to be stored
Would there be a whole new page load? When would the data be posted to the server? What are the various options for this (seemingly simple) application? I am targeting relatively small web tools. Not necessarily single page, but I'm not against it.
I understand how to add the new <li> to a list with JQuery, and I know how to build the modal with HTML. I can pull the data from the modal, but I'm not sure how to take that data from JQuery, turn it into the appropriate block of HTML (which could be rather complex), and store the new record in the database.
I can't seem to find a tutorial on this sort of data handling.
Thank you!
Simple. Since you mentioned jQuery, let's use jQuery. Ready? Here we go!
I'm assuming you have a textarea or an input in your modal where a user can enter text. If so, give it an id attribute so it can be referenced, like id="myText".
Then, to take the textarea or input's content and turn it into a list item in your list, you'll need to append an <li> with the textarea's content to its parent <ul> tag. Again, you'll need some way to reference the <ul> tag, so give the <ul> tag an id attribute, something like myList, so it becomes <ul id="myList">.
Now, it's just a matter of taking the val()ue from the input field, and appending it to the list. This is how you do that.
var textareaStuff = $('#myText').val();
$('#myList').append('<li>'+textareaStuff+'</li>');
That wasn't so hard, was it? This is actually quite fun.
I will admit, POSTing stuff to the server may take some getting used to, but it's not too hard.
I've prepared an HTML file for you that does all these things, with pretty detailed documentation. It should be able to help you learn what you're wanting to learn. It's below.
<!DOCTYPE html>
<html>
<head>
<title>My jQuery Experiments</title>
</head>
<body>
<!-- Here's your list with its ID so we can reference it in JS. -->
<ul id="myList">
<li>Sample Item 1</li>
</ul>
<input id="myText"> <!-- Here's your input field. This can be in a modal. -->
<button id="addItemButton">Add Item</button> <!-- We need a save button. -->
<!-- Include jQuery -->
<script type="text/javascript"
src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<!-- This is the javascript you'll need to write and understand -->
<script type="text/javascript" >
// When the element with id="addItemButton" is clicked,
$('#addItemButton').click(function() {
// Append the stuff in brackets to the element with id="myList"
$('#myList').append('<li>' + $('#myText').val() + '</li>');
// ^ The stuff in brackets is an li code with the value of the HTML
// element with id="myText", your input field above.
// Now to post it to a server, we'll need to use AJAX.
// Luckily, jQuery has an AJAX function. It looks like this:
$.ajax('http://example.com/mysaver.php', {
// We're POSTing stuff to the server.
method: 'post',
// This is the data to send to the server.
// It is a JSON object.
// If using PHP, you'll get $_POST['item'] = whatever is in id="myText"
data: { item: $('#myText').val() },
// If the AJAX request was successful,
success: function(data) {
// The argument 'data' contains whatever the server returned.
},
// If not,
error: function(jqXHR) {
// Handle your error here.
}
});
});
</script>
</body>
</html>
I hope this was helpful! Go ahead and approve this answer if it was, and please feel free to ask further questions in the comments and I'll do my best to help out where I can.

AngularJS w/ noscript

I am attempting to create a SPA using AngularJS as the main view for my website. I'm using ServiceStack on the server-side and can therefore cleanly serve HTML or JSON requests depending on what's accessing it. My main concern is the use of script blockers, preventing AngularJS from rendering the page properly. So far my main way of working is to render static pages, and inject a small script that redirects to the AngularJS-powered pages if it detects if Javascript is enabled. This works great since every URL works fine when the user begins at the static pages, but I've ran into a couple of snags.
Browsing to a link which includes the "?View=SPA" breaks the page if JavaScript is disabled
This causes the first page loaded to be loaded twice.
I'm looking for an alternative, but so far I haven't found any clean solutions. I was thinking about including the "?View=SPA" as a POST variable, but I'm still iffy on that implementation.
Any thoughts?
Instead of redirecting to an other page, I would implement both cases in the same HTML File as follows:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<style>.hideIfNoScript {display: none}</style>
</head>
<body ng-app ng-init="msg = 'hello world'">
<input class="hideIfNoScript" ng-model="msg" />
<p class="hideIfNoScript">{{msg}}</p>
<noscript>
<p>Content without javascript</p>
</noscript>
<script type="text/javascript">
var myEl = angular.element( document.querySelectorAll( '.hideIfNoScript' ) );
myEl.removeClass('hideIfNoScript');
</script>
</body>
</html>
The CSS Class hideIfNoScript in the head section makes sure that all HTML Tags with this class are never shown to the user, if javascript is disabled.
The noscript tag shows the alternative content.
If javascript is enabled, the little script at the end of the body section makes those elements visible. And in this case, the contents of the noscript tag are hidden.
Browsing to a link which includes the "?View=SPA" breaks the page if JavaScript is disabled
Hide those links by default:
a[href*='SPA'] { display: none; }
This causes the first page loaded to be loaded twice
Use a cookie on a browser-check page which loads the first page in an iframe or redirects to it to avoid this.
References
Track Non-JavaScript Visits In Google Analytics

How to do a 'HTTP-POST' with HyperlinkButton

I have a silverlight application where users can type in a SQL-query in the application, then the server returns the query result as an Excel file.
Users click on a download link, which is linked to a HttpHandler in the server which generates the excel file. After some research[1] I found out that using the HyperlinkButton control is the most robust way of providing links to file without the hassles of browser's popup security settings.
I need to send the SQL query, which can get quite long, as a parameter to the HttpHandler.
I can't include it in the url as querystrings(HTTP GET) due to size limitations.
Is there a way to do a 'HTTP-POST' with HyperlinkButton?
[1] Browser.HtmlPage.Window.Navigate is blocked but HyperlinkButton isn't - why?
In that case I think you can try sending a get/post request using jquery.
Post request API documentaton: http://api.jquery.com/jQuery.post/
Get Request API documantation: http://api.jquery.com/jQuery.get/
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
function f(){
$.post("http://www.w3schools.com/jquery/demo_test_post.asp",
{
name:"Donald Duck",
city:"Duckburg"
},
function(data,status){
alert("Data: " + data + "\nStatus: " + status);
}
)};
</script>
</head>
<body>
Send an HTTP POST request to a page and get the result back
</body>
</html>
Instead of Using Links Why just you make the buttons look like Links instead. One perfect example of buttons been shown as links is the Facebook. It has several number of buttons in a post, but all of them are shown as links. Here is the Css Code that what it makes a button look like a link. You can always change the look and feel of the link(perhaps Button).
Here the css code for the button.
button {
background:none!important;
border:none;
padding:0!important;
/* Do all your Styling to the Button here. It will look like a link instead. */
}
Button HTML Code.
<button>Your Button Here.</button>
Hope that Solves your Problem. Thank You.

Add HTMLelement to RootPanel in GWT

I have a <div> in my HTML page. What I need to do is, add <ul> element inside it from my Entry point class. I have tried from onModuleLoad function using below code,
UListElement ul=Document.get().createULElement();
ImageElement img=Document.get().createImageElement();
img.setSrc("\\images\\personas");
LIElement li=Document.get().createLIElement();
li.appendChild(img);
ul.appendChild(li);
Document.get().getElementById("divPhotos").appendChild(ul);
but my <div> is empty/has no childs when i run it. what am I missing here?
Your code is okay assuming you have correctly assigned the "divPhotos" id to a div in your HTML DOM. I suspect that you are viewing the page source and expecting to see the newly appended DOM elements. What you want to view is the pages live DOM. How you inspect the DOM in depends on the web browser you are using. if your using Google Chrome, press F12 to access the debugging tools which will allow you to transverse the live DOM. For Firefox, you need to install Firebug. Other browsers provide their own debugging mechanisms.
I have forgot to add nocache.js in html page.
<script type="text/javascript" language="javascript" src="test/test.nocache.js"></script>
Its working now...

Resources